Overview
Design system 1 is a Lit Web Component library. Load its stylesheet and module, then write ds-button, ds-input, ds-table and the other elements directly in HTML. React adapters use the same components.
Use with HTML · View and download examples
Four layers
Section titled “Four layers”1 Root supplies the shared colours, type, scale, theme and language. 2 Core contains individual components. 3 Unit composes them into calendars, tables, navigation and forms. 4 Page arranges them into layouts.
Browse the components. Each page shows the component’s properties, slots, events and examples. Components own their appearance and interaction; your application supplies data and actions.
One library, your design
Section titled “One library, your design”Use My libraries to customize the component tokens, save a draft and publish a stylesheet. Load it after the system’s base stylesheet. Public components, guides and examples need no account.
Other platforms
Section titled “Other platforms”The native packages bring the same system to Swift and Kotlin. The email kit renders the system for inboxes. Each uses the same design foundation with its platform’s rendering model.