> Markdown version of [Overview](https://vaadin.com/docs/v14/ds/overview). Section index: [llms.txt](https://vaadin.com/docs/v14/ds/llms.txt)

# 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.

## <a id="sections"></a>Sections

### <a id="foundation"></a>Foundation

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

[See Foundation](https://vaadin.com/docs/v14/ds/foundation.md)

### <a id="components"></a>Components

Inputs, controls, and layouts for user interfaces.

[Browse Components](https://vaadin.com/docs/v14/ds/components.md)

### <a id="figma-libraries"></a>Figma Libraries

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

[See Figma Libraries](https://vaadin.com/docs/v14/ds/figma.md)

### <a id="custom-themes"></a>Custom Themes

Learn how to create a custom design system theme.

[Creating a Custom Theme](https://vaadin.com/docs/v14/ds/customization/custom-theme.md)

### <a id="theme-editor"></a>Theme Editor

[Image: theme editor icon]

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

[See Theme Editor](https://vaadin.com/docs/v14/ds/customization/theme-editor.md)

### <a id="icons"></a>Icons

Over 600 built-in icons for business applications.

[Browse Icons](https://vaadin.com/docs/v14/ds/foundation/icons/vaadin.md)

`F0D6B0DE-BD90-4A11-BAC6-F75D8FCAC127`
