# overlay Displays elements on top of other elements. ## Overview The `overlay` element provides the ability to place elements on top of images contained within a `lockup` element. The `overlay` element superimposes the elements it contains over an image. The `overlay` element creates a view where the elements it contains are arranged using the `tv-align` and `tv-position` styles. Containing elements are centered by default.  Elements contained in the same position are arranged from the top of the cell to the bottom, in the same order in which they are specified in the `overlay` element. You can specify a `` that displays a background image inside of the `overlay`. The background image is top-aligned and is fitted to the size of the `overlay` while keeping the image’s original aspect ratio. Text wrapping inside of the `overlay` only occurs in the `header`, `center`, and `footer` positions. ### Subelements of overlay - [badge](/documentation/TVML/badge) - [description](/documentation/TVML/description) - [progressBar](/documentation/TVML/progressbar) - [subtitle](/documentation/TVML/subtitle) - [title](/documentation/TVML/title) ### Elements that Use overlay - [lockup](/documentation/TVML/lockup) ## Topics ### Valid TVML Styles [padding](/documentation/TVML/padding) Specifies the padding between the border and contents of an element. [tv-align](/documentation/TVML/tv-align) Aligns an element horizontally inside its parent. [tv-position](/documentation/TVML/tv-position) Sets the position of an element inside of its parent element. ### Valid TVML Attributes [binding](/documentation/TVML/binding) Associates information in a data item with an element. [prototype](/documentation/TVML/prototype) Associates a data item type with an element. [theme](/documentation/TVML/theme) Sets the color scheme for an element. --- Copyright © 2026 Apple Inc. All rights reserved. | [Terms of Use](https://www.apple.com/legal/internet-services/terms/site.html) | [Privacy Policy](https://www.apple.com/privacy/privacy-policy)