# UiConfig

interface

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-core/src/editor/editorconfig.ts#L1741)

<a id="properties">

## Properties

<a id="member-overlayContainer">

### `overlayContainer?: ShadowRoot | HTMLElement`

The element or shadow root that hosts the editor's overlay layer.

The overlay layer (internally the [body collection](module_ui_editorui_editoruiview-EditorUIView.md#member-body)) hosts the editor's floating UI – balloons, dialogs, and tooltips. It is rendered outside the editor's own DOM structure so it stacks above the editor and is not clipped by scrollable or `overflow: hidden` ancestors.

When the editor runs inside a shadow root, provide this container as a separate shadow root attached to a host element placed at the end of `document.body`, rather than to an element nested in the editor's own tree. As a direct child of `document.body`, that host has no scrollable or `overflow: hidden` ancestor to clip the overlay layer, and its own shadow root keeps it a self-contained styling boundary:

```typescript
const overlayHost = document.body.appendChild( document.createElement( 'div' ) );
const overlayContainer = overlayHost.attachShadow( { mode: 'open' } );

// A shadow root does not inherit the page styles, so the editor stylesheets must be adopted into it
// (for example through its `adoptedStyleSheets`) for the overlay layer to render styled.
overlayContainer.adoptedStyleSheets = editorStyleSheets;

ClassicEditor
	.create( {
		attachTo: document.querySelector( '#editor' ),
		ui: {
			overlayContainer
		}
	} );
```

When it is not set, the editor falls back to auto-detecting the shadow root it lives in (open or closed). Treat this only as a fallback – that root may clip the overlay layer; the `document.body` default is meant just for editors embedded in the light DOM.

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-core/src/editor/editorconfig.ts#L1791)

<a id="member-poweredBy">

### `poweredBy?: PoweredByConfig`

The configuration of the “Powered by CKEditor” logo.

Read more in [`PoweredByConfig`](module_core_editor_editorconfig-PoweredByConfig.md).

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-core/src/editor/editorconfig.ts#L1755)

<a id="member-viewportOffset">

### `viewportOffset?: ViewportOffsetConfig`

The viewport offset used for positioning various absolutely positioned UI elements.

Read more in [`ViewportOffsetConfig`](module_core_editor_editorconfig-ViewportOffsetConfig.md).

[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-core/src/editor/editorconfig.ts#L1748)

---

Full index of the CKEditor 5 API reference: [llms.txt](llms.txt)
