We're performing some maintenance. If you're experiencing any issues please reach out via Slack
Go to Slack
Your payment method has expired. Update your billing details to regain access to premium features.
Manage Billing

Tab Sections, Cookie Consent Modals and React Library Update

June 3, 2024

It’s a new month which means we’ve released some new components and updates to improve Relume. Happy June Component Day!

Here's what's new:

New Tab Sections

{{TeamKalebMariaJono}}

We’ve added 26 new Feature Tabs Sections.

Sometimes it feels like there's too much information to fit onto one page. That's where Tab Sections come in. Useful for comparing services or features and benefits, Tab Sections allow users to quickly browse between points of interest without having to endlessly scroll to find information.

Tab sections are often found on educational sites, travel websites, event websites with agendas, and software websites that have a lot of detailed features.

Inspiration

If you're looking for some inspiration on how to use the new Tab Sections, here are a few designs the team has put together.

Cookie Consent Modals

{{TeamKalebMariaJono}}

We are excited to introduce our brand-new Cookie Consent modals. Utilizing Finsweet’s Cookie Consent solution for Webflow, we have created 5 Cookie Consent modals that you can easily set up and have a fully compliant website in just a few steps.

These modals are designed to help you comply with cookie consent regulations like GDPR compliance in the EU and to give website visitors more control over what information they are happy to share.

React Library Update v0.2.0

{{TeamRobNour}}

The React team has released 65 new components this month. Built with React, Tailwind & Typescript they are available for copy/paste in the React Library.

New Section Highlights

New UI Element Highlights

  • Added Breadcrumb component
  • Added DropdownMenu component
  • Added Pagination component
  • Added Sheet component
  • Added Switch component
  • Added Table component

Read the full changelog in the Relume React Docs.

A preview of some of the new React components.

The Premium Figma Kit is now free

We're excited to announce that we're making our Premium Figma Kit free for everyone. This means a simplified and improved experience for all our existing users, both free and paid. We now have one Relume Figma Kit available in the Figma Library in your dashboard and the Figma Community.

Why have we done this?

We aim to empower designers and developers to create websites faster with AI. Simplifying our Figma offering into one kit lays the foundation for some exciting new features we're working on, which we can't wait to show you! In addition, this simplifies and enhances our current experience to ensure all of our users, both free and paid, are experiencing the full power of Relume.

Where can I get it from?

To receive the latest version of the new Relume Figma Kit, visit the Figma Library in your dashboard.

Figma Kit Update (v2.4)

{{TeamKalebJonoDamian}}

We have added all 31 new components to our Figma Kit, which is available in both desktop and mobile variants. To receive the latest update, visit the Figma Library in your dashboard.

Written by Damian Martelli, Kaleb Jae & Rob Austin

Edited by Adam Mura

Wireframing 1.0
Wireframing 2.0
Library coverage
Uses ~25% of marketing components.
Uses ~70% of marketing components.

More variety and creative layouts appear in generations.
Brand style fit
Mixed styles, not brand-aware.
Selects styles that match the project description (e.g., off-grid/overlapping for agencies; card layouts for SaaS).

Wireframes feel “on-brand” from the first draft.
Section content match
Defaulted to generic layouts (e.g., always 3 pricing plans), relying only on the section title.
Selects components based on content count using both title & description (e.g., “2 pricing plans” generates a 2-plan layout).

Sections communicate the right thing with the right structure.
Page flow awareness
No awareness of position/order.
Chooses components with placement in mind; improves rhythm and alternation.

Smoother narrative and fewer repetitive beats down the page.
Site-wide consistency
Components are not reused across pages.
Reuses suitable components across pages for coherence.

A more unified site with less rework later.
Copywriting 1.0
Copywriting 1.5
Context
Only looked at one section at a time.
Considers the entire page.

Less repetition, smoother flow across sections
Model
OpenAI GPT
Claude

Sharper, more natural copy.
Quality
Generic, often placeholder text.
More relevant, compelling, and usable.

Saves editing time, closer to production-ready.
Consistency
No awareness of position/order.
Unified tone across the whole page.

Feels like one voice, not stitched-together fragments.
Team
Andy, Sam & Sanskar
Team
Andy & Sam
Team
Damian & Sam
Team
Damian & Sanskar
Team
Damian & Meredith
Team
Damian & George
Team
Damian, Maria & Chester
Team
Rob & Nour
Team
Kaleb, Maria & Jonathan
Team
Kaleb & Maria
Team
Kaleb, Jonathan & Damian
Team
Kaleb, Damian, Jonathan & Maria
Team
Damian, Maria & Marc
Team
Damian, Maria & Kaleb
Team
Kaleb & Matt
Team
Kaleb, Matt & Jonathan
Team
Andy, Chris, George, Kaleb, Damian & Maria
Team
Damian, Trung, Andy, Weidong, Kaleb & Maria
Team
Nick & Abhi
Team
Nick & Weidong
Team
Nick & Max
Team
Andy & Weidong
Team
Andy, Diego & Trung
Team
Marc & Trung
Team
Marc & Arman
Team
Pantelis