Duo Design System
One design language for Talentech products—tokens, components, and guidance you can adopt step by step.
Get startedBuild with Duo
Design tokens
Platform-agnostic variables for color, typography, spacing, and more.
Web components
Framework-agnostic UI from @duo/ui—buttons, fields, dialogs, and more.
Styles
Global base CSS and duo-u-* utilities—load after tokens.
Icons
Monochrome UI icons for duo-icon.
Assets
Illustrations, product logos, and flag SVGs.
Patterns
Documented UX patterns for consistent product behavior.
Guidelines and templates
Guidelines
Writing, errors, punctuation, forms, and product copy standards.
Templates
Email and HTML starting points that follow Duo styling.
Shared foundations
Accessibility
Inclusive interfaces—WCAG-oriented guidance built into components and docs.
Tokens and theming
Browse --duo-* variables and learn how to import @duo/tokens/css.
Principles
Consistent, accessible, token-driven, and practical to adopt incrementally.
Questions or collaboration?
Reach out in Slack #product-design.