> Markdown version of [Dynamic Styling](https://vaadin.com/docs/v10/flow/element-api/tutorial-dynamic-styling). Section index: [llms.txt](https://vaadin.com/docs/v10/flow/llms.txt)

# Dynamic Styling

To change the look and feel of your application, you can style it by using dynamic class names or inline styles. Using `getClassList()` in `Element`, you can dynamically modify the class names of any element as follows:

```css
.blue {
  background: blue;
  color: white;
}
```

```java
button.setText("Change to blue");
button.addEventListener("click",
    e -> button.getClassList().add("blue"));
```

In this case you are limited to the styles you have defined in advance. To get really dynamic styles, you can use the inline styling API `getStyle()`:

```java
Element input = ElementFactory.createInput();
button.setText("Change to the entered value");
button.addEventListener("click",
    e -> button.getStyle().set("background",input.getProperty("value")));
```

Using `getStyle()` you can set any style property supported by the browser.
