Pattern Image
Pattern Image
Made in Figma

The Ultimate Design System for Modern Web Designers

Streamline Your Design Workflow with Time-Saving Efficiency

Preview Image
Harper Davis
Orla Flores

Used by designers and teams from

Pattern Image
Pattern Image
Lighting-fast design

Power Up Your Design Process

Experience lightning-fast design with our powerful features that streamline your workflow and help bring your vision to life.

Pattern Image

12K+ Components

Fuel your creativity with an expansive array of adaptable and dynamic design components.

ImageImageImageImageImageImage
+9
Badge
Badge
Badge
Avatar
Orla Flores

Helpful text goes here

Tooltip text

A tooltip is a short text box that is linked to an element of your website. It provides contextual help to show the user what that particular element of your site does.

Monthly Billing
Yearly Billing
Pattern Image

Light & Dark

Enhance user experience with Dark & Light mode.

Figma Variables

Variables in Figma empower you to create dynamic.

variables
Text-error
Badge-success-text
Text-secondary
Icon-secondary
Layer-on-background
Text-primary

Typography

Transform your designs with stylish and expressive typography choices for captivating visual experiences.

Responsive

Create a seamless user experience with a responsive design that adapts to all devices.

Collaborate seamlessly and manage your projects with ease usingour all-in-one project management platform

Collaborate seamlessly and manage your projects with ease using our all-in-one project management platform

Empty state icons

Enhance user experience with delightful icons.

12k+

Total components

500+

Example sections

160+

Example pages

2,100+

Hand-drawn icons

Pattern Image
Pattern Image
Unleash Creativity

Optimized for every type of skills

A Professional-Grade design system that adapts to every project's unique needs

Seamless Design Harmony

Unlock design harmony using Tokens that effortlessly synchronize colors, typography, and more.

TokenRoleLightDark
Background-primary-baseDefault page background
white
gray-900
Layer-on-background-1Default page background
white
gray-800
Text-colorText color for button-tertiary
primary-700
primary-400
Text-helperTertiary text, Help text
gray-500
gray-400
Button-primaryPrimary button background color
primary-500
primary-500

Your design companion

Hone your skills with in-depth component documentation for precision.

Share

Button types

PrimarySecondaryInverseGhost
Junior Designers

Learn the Building Blocks and Best Practices for Creating Stunning User Interfaces

Senior Designers

Say Goodbye to Repetitive Work and Headaches with a Streamlined UI Design System

Product managers

Get Straight to Your Goals with a Comprehensive UI System

Freelance designers

Automate Operations, Attract More Clients, and Deliver High-Quality Results

Developers & engineers

Code Faster and Smarter with Ready-to-Use Figma Templates

Startup

Accelerate Your Design with a Library of Customizable Templates

Pattern Image
Pattern Image
⟣ Pay once — lifetime updates ⟢

Choose Your Plan

We provide a very simple and transparent pricing model.

Starter
$0

Get pro features and benefits with our single license user.

Single user license
Design foundations
Utility elements
Light mode
500+ consistent icons
Section examples
Unlimited projects
Professional
$109

Get pro features and benefits with our Single license user.

Single user license
Design foundations
12k+ Utility elements
Light, Dark & Darkest
Includes empty state icon
Includes Riddle icon
Includes Templates (Figma files)
Includes Framer library (Soon)
Page & Section examples
Unlimited projects
Lifetime updates
Team
$169

Unlock productivity with our Team plan for 6 users.

Up to 6 users license
Design foundations
12k+ Utility elements
Light, Dark & Darkest
Includes empty state icon
Includes Riddle icon
Includes Templates (Figma files)
Includes Framer library (Soon)
Page & Section examples
Unlimited projects
Lifetime updates
Unlimited

Large design teams. agencies, and enterprises with unlimited members.


Unlimited users license
Design foundations
Utility elements
Light, Dark & Darkest
Includes empty state icon
Includes Riddle icon
Includes Templates (Figma files)
Includes Framer library (Soon)
Page & Section examples
Unlimited projects
Lifetime updates
Unlimited
$399USD

Pay once, own it forever

Frequently asked question

Explore common queries about Riddle UI Design System and its benefits

Stay up to date

Subscribe for important news, resources and more…

© 2024 Riddle UI Inc. All rights reserved