Docs

You are viewing documentation for an older Vaadin version. View latest documentation

Docs

Design System

Vaadin Design System consists of modern UI components with customizable styling, comprehensive documentation, UI design assets, and the tooling you need to build a solid foundation for your applications.

Sections

Foundation

Design tokens for typography, colors, spacing, and visual styles.

See Foundation

Components

Inputs, controls, and layouts for user interfaces.

Browse Components

Figma Libraries

Prototype and design application layouts in Figma using official Vaadin libraries.

See Figma Libraries

Custom Themes

Learn how to create a custom design system theme.

Creating a Custom Theme

Theme Editor

theme editor icon

An online editor to create a custom theme for your application.

See Theme Editor

Icons

Over 600 built-in icons for business applications.

Browse Icons

CSS Utility Classes

A set of CSS utility classes that enable building any UI without custom CSS.

See Utility Classes