A token-first, atomic, and AI-compatible system—v3 makes consistency easier, customization safer, and contribution simpler than ever.

Design once, scale everywhere

The styles that govern the creation of components within the design system.

Foundations

The reusable design values ensuring visual consistency and supporting flexible customization across products.

Tokens

The building blocks for creating scalable, accessible, and responsive experiences.

Components

Best practices and shared interaction patterns for digital experiences.

Patterns

Design essentials

Ask questions, get support, and check latest announcements.

DDS Teams channel

Find answers about migration, tokens, updates, and new features in DDS v3.

v3 FAQs

Community and support

v3 lowers the friction to improve the system itself.
 
Clearer structure, better abstractions, and tighter contracts between tokens, slots, and components make it easier to extend, refine, and contribute back.

Built to evolve—together.

• Aligned visual decisions across themes, products, and platforms
 
• Faster system-wide updates
 
• Scale without regressions or manual fixes

Token-first logic

• Atomic foundations for designers, engineers, and AI
 
• Modular slot-based architecture
 
• Customization without breaking system consistency

Structured foundations for humans and AI 

• Clear contracts between tokens and components for simpler, maintainable code
 
• Reduced handoff friction
 
• Faster development cycles

Cleaner code, better parity

Highlights

Figma libraries built on tokens and slots for faster, more consistent design.

Figma UI Kit

Code libraries with predictable APIs and cleaner foundations.

Code libraries

DDS v3 resources

The Dell Design System

Home

About DDS

Migration guide

AI chat toolkit

A11y annotation kit

Figma

Storybooks

Community library

Getting started

Overview

Color

Elevation

Grid

Icons

Spacing

Typography

Accordion

Action menu

Badge

Blockquote

Breadcrumb

Button

Card

Carousel

Checkbox

Date picker

Divider

Drawer

Dropdown

File input

Footnote

Link

List

Loading indicator

Message bar

Modal

Notification

Overlay

Pagination

Popover

Progress bar

Progress tracker

Radio button

Search

Select

Side navigation

Switch

Tabs

Text area

Text input

Time picker

Tooltip

View more/less

AI design library

Micro-moments

Area chart

Bar chart

Bubble chart

Donut chart

Gauge chart

Line chart

Metrics card

Pie chart

Utilization chart

Dashboard template

Data visualization

Chart customization

Drag and drop

Empty state

Filter

Form

Microinteraction

Sign-in

Accessibility

Brand

Partners

Case studies

Blog

FAQs

Tools

Videos

Resources

Send Feedback

Check My Tickets

Find us on Teams

Support