Table of Content

UI components

Design system components come in two forms — in Figma and in code. For developers, components are standards-based web components that can be used in any web codebase. For designers, components are ready-made building blocks that make it easier to create high-fidelity, consistent screens. For cross-functional teams, design system components smooth collaboration and remove ambiguities. Get started with development. Get started with Figma.

Component library

Component Figma @riverty/web-components
Accordion ready
Badge new
Button ready
Checkbox ready
Fieldset
Icon ready
Input new
List item preview
Pagination new
Radio button ready
Select ready
Tabs new
Textarea new
Tooltip new

Draft components

Some components are available in a draft, or work-in-progress, state. A draft component can be subject to larger changes. It may be that naming is not fully decided, alignment between Figma and code might be missing, or some quality assurance still remains. However, we are quite confident that these draft components will eventually graduate to a ready status.

Colleagues across Riverty also contribute new components here. We collaborate, in the open, to validate and get value as soon as possible.

Component Figma @riverty/web-components
Progress Bar draft
Progress Steps draft

Try out and feed back

We especially invite teams to try out the @riverty/web-components package. Please report bugs and suggest improvements, it's super helpful. Join the Riverty Design System Group in MS Teams.