Components

The Vaadin Design System includes a set of components that you can use to build your UI. The components have a server-side Java API in addition to the TypeScript API for client-side development.

You use a component by first creating it and then adding it to a containing layout.

For example, to add a Button component, create the object and add it to a layout.

Open in a
new tab
Button button = new Button("Click me!",
  event -> event.getSource().setText("Clicked!!!"));
add(button);

Topics

Basic Features
Common features available in all components.
Enabled State
Components that allow user interaction can have three different enabled states.
Keyboard Shortcuts
Shortcuts allow you to assign keyboard shortcuts to your components to improve end-user experience.
HTML Elements
Flow comes with a set of components for standard HTML elements.
Creating Components
Creating components by combining or extending existing ones, or by constructing a new one using the Element API.
Integrating Web Components