---
name: ".up-booted"
area: "API"
kind: "CSS class"
parent: "up.framework module"
visibility: "experimental"
url: "https://unpoly.com/api/up-booted"
---
<nav aria-label="Unpoly docs">[All docs](https://unpoly.com/index.md) · [up.framework module](https://unpoly.com/api/up.framework.md)</nav>

# .up-booted

**This feature is experimental**. Please [share](https://github.com/unpoly/unpoly/discussions) your experiences so we know what to keep or change.

This class is set on the `<html>` element after Unpoly has [booted](https://unpoly.com/api/up.boot.md).

All [compilers](https://unpoly.com/api/up.script.md) will already have run on the initial page content.

You can use this class to hide elements until Unpoly has processed them, e.g. to [hide switched elements before booting](https://unpoly.com/learn/switching-form-state.md#before-booting):

```css
html:not(.up-booted) :is([up-show-for], [up-hide-for]) {
  display: none;
}
```

The class is not set when Unpoly [cannot boot](https://unpoly.com/api/up.framework.isSupported.md) or fails to load. Elements hidden by such a rule would then stay hidden.

<nav aria-label="Guides">

- [Learn: Switching form state](https://unpoly.com/learn/switching-form-state.md#before-booting)

</nav>