> Markdown version of [Shadow root in server-side Element](https://vaadin.com/docs/v10/flow/element-api/tutorial-shadow-root). Section index: [llms.txt](https://vaadin.com/docs/v10/flow/llms.txt)

# Shadow root in server-side Element

Elements contain support for adding a shadow root for Element types that support it. This enables for the creation of serverside webcomponents. [Elements without shadow root support](#not-applicable-elements)

A shadow root can be created simply with the command:

```java
Element element = new Element("custom-element");
ShadowRoot shadowRoot = element.attachShadow();
```

A `ShadowRoot` is not an actual element and only supports child element handling and getting the host element which contains the shadow root.

> **Note:** When adding a shadow root, any element added to the `ShadowRoot` parent will not be visible if the `ShadowRoot` doesn’t contain a `<slot></slot>` element. See [Components in slot](https://vaadin.com/docs/v10/flow/polymer-templates/tutorial-template-components-in-slot.md) for more information.

All new elements should be added to the `ShadowRoot` element so that they will be encapsulated in the shadow tree of the hosting element.

```java
@Tag("my-label")
public class MyLabel extends Component {

    public MyLabel() {
        ShadowRoot shadowRoot = getElement().attachShadow();
        Label textLabel = new Label("In the shadow");
        shadowRoot.appendChild(textLabel.getElement());
    }
}
```

### <a id="not-applicable-elements"></a>Missing shadow root support

- The browser already hosts its own internal shadow DOM for the element (\<textarea>, \<input>).

- It doesn’t make sense for the element to host a shadow DOM (\<img>).