Scale - Figma Design System

Design Better, Deliver Faster

A Figma Design System that helps individuals and organisations Scale.

Changelog

28/04/24: Version 2.5.0 released!

Check out the changelog here.

Features

Typography Variables are finally here!

Responsive type that switches between Desktop, Mobile and App breakpoints

• Primitive and Semantic Type Variables
• Switch between web and app breakpoints automatically
• Design web and app products with one set of text styles and components

Saving the world with Semantic Variables

Assign color with intent, and set yourself up for automatic mode switching

• Assign color in a meaningful way that scales across any theme or mode
• Switch between Light to Dark modes automatically
• Speak the same language as your developers

Design landing pages and apps faster with content modules

40 modules, hundreds of outcomes

• Hero, Feature, Logo, Pricing, CTA, FAQ and Carousel modules
• Use with breakpoint variables to swap between Desktop and Mobile widths
• Landing page examples that show you what you can create

Properties, Nested Instances, Variants, they’re all here

A family of components that come with properties and nested instances

• Select a component, dial up the outcome you want, swap nested instances
• Gain 1:1 parity with your developers with properties that match what they’ll use in code

What’s inside?

291 Variables

Color, Semantic, Typography, Spacing, Border Radius and many others.

3000+ Components and Variants

Thousands of possibilities with variants and properties.

306 Icons

Scale comes with a baseline set, then teaches you how to create your own so you only ever have what you need.

29 Text Styles

T-shirt sized text styles, driven by Type Variables.

2 Free UI Kits

Scale.Chat and Scale.madewithscale

Before you buy

Licence Agreement

Make sure you read the Licence Agreement before completing your purchase.

Learn more

Scale site

http://www.scaledesignsystem.com/

Questions

info@scaledesignsystem.com