UI Starter Kit
The little details
Not going to click around? These are the small things that make it feel right, zoomed in.
One bar restyles everything
Pick purple, set roundness and shadow to L, and every button, switch and checkbox follows at once. Each brand color is a ramp of 11 shades, so hovers and borders stay in tune.
Light and dark from the same tokens
Flip to Light and the surface, text and border tokens swap in one go. The components don't know which mode they're in, they just read the theme. Flip back and nothing changed.
Every component up close
Click a card and it opens big, with arrows to page through all nine. The dropdown really opens, and the theme bar keeps working while you look.
How it's built
- One theme view model with tokens for color, mode, roundness and shadow, bound to every component.
- Nine components: button, switch list, slider, dropdown, radio group, checkbox group, badge, label and avatar.
- Every component is its own artboard with its own state machine, so you can drop one into another file.
- Hover and press colors come from the theme too, so a new brand color needs no extra work.
- The showcase uses Rive layouts: a scrolling grid of cards and a detail view you can page through.
Use it in your own project
The file is free on the Rive Marketplace: open it in the Rive editor, make it your own and use it in your game or app.
Download it free on the Rive MarketplaceReady to make it fun?
We design the streaks, rewards, and animations that turn first-time users into regulars. Book a call and see the engine behind this site.
