Style Guide Builder Public Beta, New Components and Improved Search

February 4, 2025

What's New

It’s a new month which means we’ve made updates to improve Relume. Happy Component Day!

Here's what's new:

Style Guide Builder - Public Beta

After making its way through a closed Beta, our Style Guide Builder is now ready for the public Beta! 🎉 The full release is set for March 4th, 2025, as we put the finishing touches on exporting to Webflow and Figma.

In the meantime, you can bring your design visions to life and apply them directly to your homepage. This means faster turnarounds on client briefs, giving you the competitive edge to pitch and close more projects, faster. ⚡

Enhance your color palette

Color makes its way to Relume’s very black-and-white environment with the Color Palette Generator. Generate complementary color palettes and pre-made shades for each color with a single click. Instantly visualize how your colors work together on your homepage.

Biggest learning from Beta

At first, our color generation was pretty random, focusing only on combinations we knew would work without fail. While this was great for new brands, we quickly realized many of our Lumers were working with existing brand palettes that needed thoughtful expansion—not just random pairings.

So, we leveled up the system by adding context-aware rules. Now, you can add a color, lock it in, and shuffle through options that intelligently expand your palette while keeping it aligned with the brand. More control, better results, and no more guesswork

Applying colors as schemes

Once you’ve nailed down your color palette, we instantly generate Schemes for you. Each color comes with four dark and four light variations, ready to go. With a simple click in the preview section, you can quickly cycle through shades, watching your content and UI adapt in real time—ensuring perfect contrast every step of the way

Biggest learning from Beta

Users loved how effortlessly our schemes applied in the preview section. Where we fell short was relying too much on keyword shortcuts, which didn’t click (literally) with users who prefer traditional interactions. To fix this, we enhanced the hover panel on sections, creating a smoother, more intuitive experience for both shortcut lovers and click-first users alike.

Discover new typeface pairings

We’ve all been guilty of overusing a favorite font across multiple projects—sometimes, there’s just no time to hunt for new ones on font foundry websites. With Style Guide Builder, that’s no longer a problem. Just tell us a style you like or Like your go-to fonts, and we’ll recommend fresh typefaces in a similar direction—helping you keep your designs feeling new without the extra effort

Biggest learning from Beta

We found that most users were too ingrained in the typical “browse” flow for finding fonts, which meant they completely missed the AI recommendation feature. To fix this, we added a short, browse-style onboarding that helps users define what they’re looking for before presenting them with AI-suggested options. Now, it feels more natural while still delivering smarter recommendations.

Refine UI elements with ease

One of the most time-consuming parts of designing a website is styling UI elements like buttons, forms, cards, and images. With Style Guide Builder, you can skip the hassle and choose from a library of custom, pre-styled UI elements—then, with one click, watch them instantly apply to your homepage. Simple, fast, and built to fit your style

Biggest learning from Testing

While these options all looked great on their own, some combinations didn’t quite feel like a cohesive family—some even stood out like a sore thumb. To fix this, we added smart pairing logic for buttons and cards, tweaking their styles based on your choices to create a more balanced and seamless design across your project

Share a live preview

Gain a competitive edge by quickly turning ideas into polished design concepts. Impress clients early by showcasing real, high-quality visuals—demonstrating your speed, expertise, and commitment to their project

15 New Components

We've put together what we're calling a Party Mix of components built in Figma, Webflow, and React for this latest update. From dynamic sliders to eye-catching headers, these versatile additions will help you create more engaging websites. Let's dive into what's new.

Hero Headers with Full-Bleed Images

Bring bold visual impact to your websites with our new Hero Headers featuring full-bleed images. These headers create immersive experiences, allowing your imagery to shine edge-to-edge for maximum effect.