Hello everyone,

I hope you're having a great week. We’ve made some updates to Untitled UI that I’m excited to share!

Preview at untitledui.com

What’s new in version 6.0

In version 5.0, we updated Untitled UI to support Figma’s new features released at Framework 2024 and Config 2024, rounding out color variables and introducing Figma’s new typography and effects variables.

Today, we've released Untitled UI v6.0, a different kind of update. This shiny new version of Untitled UI includes a new and refined default color palette, hundreds of new and improved components, and countless small but significant changes we’ve wanted to make for some time.

Unlike the last few updates which mainly focused on introducing variables (boring), this update is one that we’re excited about and enjoyed building.

As always, we won't cover every pixel, but here are the main updates:

Carefully refined and improved default gray color palettes for both light mode and dark mode. These are more neutral and practical with a decreased saturation (more on this below).
Carefully refined and improved default shadows and gradient styles.
New and improved Application examples, including dashboards, settings pages, and informational pages.
New full-screen Calendar component with day, week, and month views.
Improved Header navigation components with new “floating” style navigation.
Improved Application navigation components, including new Sidebar navigation components.
Many new Nav featured cards components to use in sidebar navs and layouts.
Improved Line and bar chart components, including several new chart styles and handy Chart marker component.
New Input dropdown component size and improvements so the menu resizes dynamically when menu items are removed without affecting functionality.
Improved Table components, including refined Table header components.
New Button utility component with a tooltip. These are small, subtle, and incredibly useful for dense UI such as sidebar navigation and table cells.
New Metric item components, as well as many useful new Chart mini components to use in metric cards.
New and improved Social proof sections and Testimonial sections.
Updates to the Google Maps mockup component with the addition of useful image fill styles for placeholder maps.
Improved and simplified Scroll bar component so sizing can be controlled dynamically using bottom padding.
New Modal components.
New Slide out menu components.
New “slim” Toggle component.
Improved and simplified 3:2 screen mockup, Macbook Pro mockup, and iPhone mockup components using image fill styles to dynamically switch between light and dark mode placeholders (note: only relevant for PRO VARIABLES).
New and fresh Modern screen mockup component.
Huge improvement to PRO LITE, including the addition of skeuomorphic buttons and styles and more application examples.
Refreshed all documentation images across all files.
Updated and improved placeholder images throughout the entire file (credit: Lummi.ai).
Updated and improved all thumbnail sizes to 1920x1080px (Figma recently changed thumbnails to a standardized 16:9 ratio instead of a weird 5:3 ratio).
Subtle improvements to dozens of other components (e.g. Credit card mockup, Breadcrumbs, Command menus) so they look nicer, are easier to use, and/or are more accessible.
Last but not least, a subtle update to the Untitled UI logo (hat tip: @huseyingayiran) + much more…

All of these updates are included for free in all three different versions of Untitled UI:

Untitled UI PRO VARIABLES: Color (including dark mode!), spacing, radius, width, typography, and effects variables.
Untitled UI PRO STYLES: Does not include variables for those who prefer to keep their workflow simple.
Untitled UI PRO LITE: Our lightweight version of the full Untitled UI PRO STYLES kit. It’s 55% lighter and faster and is designed to include everything you need.

Preview at untitledui.com

We’ll be publishing future changes to Untitled UI on our changelog.

In case you missed it last time, we’ve also created some new pages on the site so you can quickly copy useful design assets from Untitled UI right into your design projects:

1,100+ FREE icons: We’ve added a quick search and copy to SVG page featuring 1,100+ icons from Untitled UI Icons.
180+ FREE logos: Need some placeholder logos for your designs? Click to copy from this collection of fictional logos in SVG format.
370+ FREE avatars: Download these free placeholder user avatars and profile pictures to use in your design projects. Available in JPG, PNG and WEBP formats or a Figma library!

Please share them on X (Twitter) if you find them useful! They’re 100% free to use in personal and commercial projects, even if you’re not a customer of Untitled UI.

New default gray color palette

Untitled UI’s v5.0 default gray color palette was slightly blue saturated, giving it a “cooler” feel. This is a common approach, particularly in B2B and SaaS because it works well with “cooler” colors such as blue, indigo, and purple (e.g. Stripe).

With the release of Untitled UI v6.0, we switched the default gray color palette to a less saturated “flat” gray, for a clean and modern look and feel:

Why did we change to this new color palette?

This new gray color palette is more neutral with less blue saturation, making it easier to work with regardless of your project and your brand colors.

After using Untitled UI in dozens of different projects and creating 1,000+ daily design posts, we often found ourselves reverting to the Gray neutral, Gray iron, and Gray true alternative color palettes included with Untitled UI, all of which are desaturated.

The new gray color palette is more aligned with our long-term goal for Untitled UI: to be the perfect starting point for any project. It’s neutral, clean, and just “works”, regardless of what you’re working on.

Of course, if you want to revert back to the gray color palette used in Untitled UI v5.0, just edit your color variables or styles in your file to the following:

Gray 25: #FCFCFD
Gray 50: #F9FAFB
Gray 100: #F2F4F7
Gray 200: #E4E7EC
Gray 300: #D0D5DD
Gray 400: #98A2B3
Gray 500: #667085
Gray 600: #475467
Gray 700: #344054
Gray 800: #182230
Gray 900: #101828
Gray 950: #0C111D

You can find a step-by-step guide on how to change your color palette inside the Figma files under FOUNDATIONS > Colors > Notes and documentation.

New placeholder images in Untitled UI

As part of this update, we refreshed a bunch of the placeholder images in Untitled UI. The majority of these new images are sourced from Lummi.ai — AI stock images that won't make you cringe.

This isn’t an ad, we just wanted to give it a little shout-out because it’s an awesome resource and an interesting alternative to Unsplash and Pexels. Thanks @pablostanley!

You can preview Untitled UI v6.0 via untitledui.com. We’ll be publishing future changes to Untitled UI on ourchangelog.

Have a great week,
Jordan

Follow me on X (Twitter), Layers or Dribbble.

We have a favor to ask…

Could you please rate us ★★★★★ on Gumroad? It really helps us out and the more support we get, the more time and resources we can spend on making Untitled UI even better for you... with new products and free updates for life.

Leave a rating

If you don't have a Gumroad account, you can find your link to this page by clicking Access Untitled UI in your original purchase email. These are sent from noreply@customers.gumroad.com with the subject You bought Untitled UI – Figma UI kit and design system!

FAQ

View more FAQs here.

I’ve already purchased Untitled UI, how do I access the new files?

After each update, we’ll send you an email (like this one) with what’s new. If you like what you’re reading, you can download the new files:

From your Gumroad library if you made an account.
If you don't have an account, you can click View content or Access Untitled UI in your original email. These are sent from noreply@customers.gumroad.com with the subject You bought Untitled UI – Figma UI kit and design system!

Your unique download links update regularly. Once you've got the updated link, just re-download the PDF with the updated links.

How do I update my Figma file with the new updates?

There are three ways to go about this, depending on how you’re working with the file:

Figma recently announced a swap library feature and you can learn how it works here. We recommend making a backup before.
If you’re not interested in everything that’s changed, it’s likely easier to copy+paste any new components into your current file and then simply swap the styles out in those components to your local styles.
If you’re using a copy of Untitled UI as a base for each project, start fresh with the new version next time you kick one off!

Why don't my links work any more?

Don’t stress! Please don't panic email us. Your unique download links update regularly but you can always access the most up-to-date link via your original receipt email.

Just re-download the PDF and it will have updated unique links.

Can I split up the library?

Absolutely! Figma recently introduced a move published components feature to deal with just this.

This allows you to split up the library into smaller libraries that can be published independently. For example, you may want to split the file into four libraries:

Styles and shared components
Marketing components
Application components
Page examples

There is a more detailed breakdown of how this works on the Getting started page within the actual Figma files.

Why isn’t the library split up already?

Good question! Currently, it isn’t possible to import more than one file at a time into Figma without breaking links to instances in the design system across the files.

Because of this, the file needs to be imported together and then split up into separate libraries (if you want to do that) after it’s imported. Hopefully, this functionality will be introduced soon!

Do I need to split up the file?

Absolutely not! You may decide it’s easier to simply delete the components you know you won’t need at the start of each new project.

Do you really need to keep 20 different footer components once you’ve chosen one? Probably not! But it’s entirely your decision whether or not you want to keep them.

We personally find it easier to work from a single library rather than across several, removing components we don’t need as we go. Large files can be slower to work with, especially when Figma isn’t performing as well as it usually does or you’re experiencing a slow internet connection.

Did you know we have a 30% affiliate program?

A simple and easy way to make 30% of every sale you refer to Untitled UI. There's no limit on how much you can earn — many of our affiliates have earned thousands of dollars. Earn up to $299.70 on each sale!

“I’m super grateful to have stumbled across Untitled UI just over a year ago, and I’m still in shock at how well the affiliate link performed last year. Easily one of my top highlights of the year. Thanks again.”

— Untitled UI affiliate

Become an affiliate

As always, thanks for your support!
Jordan

Untitled UI v5.0 — Config 2024 + typography and effects variables + new components ✨

Untitled UI v4.0 — Dark mode, variables & Auto Layout 5.0 ✨

We've released an update to Untitled UI PRO + PRO LITE ✨

We've released an update to Untitled UI PRO + PRO LITE ✨

We've released an update to Untitled UI ✨

See all posts from Untitled UI