A commercial Vaadin subscription is required to use Designer in your project.
Vaadin Designer is a visual tool where you can drag and drop - and configure - web components on a canvas. With Designer, you always have the end result in front of you. Any change you do is instantly reflected in the live preview of the UI you are building.
- WYSIWYG design canvas
Drag and drop web components. Updates when the design properties or styles are changed.
- Quick layout editing
Control VerticalLayout, HorizontalLayout, and other flex containers quickly with flexbox controls.
- Sizing and spacing panel
Set width, height, margin, padding, spacing properties with CSS values, or Lumo presets using a drop-down.
- Viewport controls
Quickly check the responsiveness of the design.
- Palette shows snippets and components
Pre-built snippets for Vaadin components. Use any web components from the project.
- Outline to display component hierarchy
Change component hierarchy using drag and drop. Connect components to the Java companion file.
- Preview in browser or on your device
View design on a mobile device with one click. Share the preview link to others.
- Work within your project
Work with designs directly in your Java project. Use a Java companion file to connect design to back-end data.