Valo

Buttons

The additional theme styles can be applied together, with the exception of styles inside a single section which are mutually exclusive.

For example, you can combine the primary style with the small, icon and success styles, but you can’t combine primary with tertiary or success with danger.

Types

Disabled

Icons

Colors

Sizes

---

Styling API

Custom properties

--valo-button-text-color: var(--valo-primary-text-color)

--valo-button-background-color: var(--valo-tint-80pct) for light, var(--valo-tint-5pct) for dark

--valo-button-border-radius: var(--valo-border-radius)

--valo-primary-button-font-weight: 600

Shadow parts and states

See the API documentation for vaadin-button.