Custom Design Systems in Compose
summary
Dropbox implements its DIG design library in Jetpack Compose by creating a custom DIG theme that provides its own token classes and then maps those tokens into Material tokens so existing Material components work out of the box The team uses a composition local provider to scope tokens and a wrapping Material approach to let product engineers ship Compose features immediately while gradually replacing Material components through an audit process that is already in production use
AI-written summary · about
chapters (12)
- 0:00Introduction
- 1:31Compose UI structure
- 3:16Material design layers
- 5:22Design system tokens
- 7:31Customizing material themes
- 10:42Extending material theme
- 12:32Composition locals in theming
- 18:12Fully custom design systems
- 21:30Dropbox’s design system goals
- 25:41Wrapping material approach
- 30:38Migration and custom components
- 34:58Current roadmap status
related talks
50mCustom Design Systems in Compose
49mImplement your own design system with Jetpack Compose
41mImplementing a Design System in Compose
39mA Design System, it Composes!
26mCompose Beyond Material Design
15mBuild beautiful Material Design apps with Jetpack Compose
31mDesign System 3.0 with Jetpack Compose at N26
18mOne design system to rule them all 1