Archived docs Get your API Key
Get started
Tutorials
Guides
Reference
Help for AI agents
🤖 AI Assistant

Text style 011

Style ID: 011

Displays text as a static block with optional background color behind each line. No animation is applied. Unlike style 001, this style wraps each word in its own span element, allowing the background-color setting to highlight individual words/lines rather than the entire text area. Ideal for highlighted/boxed text overlays.

AnimationNone. Text appears immediately as a styled block.
Best forHighlighted text, boxed captions, text with colored background per line, news-style text overlays.
Intro duration5 s

Preview

Example

{
    "type": "text",
    "style": "011",
    "text": "The hills are alive with the sound of music",
    "settings": {
        "font-size": "6vw",
        "font-family": "Inter",
        "font-weight": "700",
        "text-align": "left",
        "background-color": "#000000"
    },
    "width": 450,
    "x": 50,
    "duration": 5
}

Default settings

The settings object of a text element using style: "011" ships with these defaults. Any property you set on the element overrides the default.

PropertyTypeDefaultDescription
vertical-positionstringcenterVertical position of the text block within the element area.
horizontal-positionstringcenterHorizontal position of the text block within the element area.
font-sizestring6vwFont size. Use CSS units: px (e.g. '60px'), vw for responsive (e.g. '5vw'), or em.
font-familystringInterGoogle Fonts family name (e.g. 'Inter', 'Roboto', 'Anton', 'Bebas Neue'). Any Google Font is available.
font-weightstring700Font weight: '100' to '900', or 'normal', 'bold'.
text-alignstringleftHorizontal text alignment within the text box.
colorstring#FFFFFFText color. Hex (e.g. '#FFFFFF'), named color (e.g. 'white'), or rgba().
background-colorstring#000000Background color behind each word/line of text. Especially effective with style 011 (text block).

Common text style settings

All text styles accept the same CSS-like settings; only the entry animation differs. The properties below are common to every style.

PropertyTypeDefaultDescription
font-sizestring4vwFont size. Use CSS units: px (e.g. '60px'), vw for responsive (e.g. '5vw'), or em.
font-familystringInterGoogle Fonts family name (e.g. 'Inter', 'Roboto', 'Anton', 'Bebas Neue'). Any Google Font is available.
font-weightstring400Font weight: '100' to '900', or 'normal', 'bold'.
colorstring#FFFFFFText color. Hex (e.g. '#FFFFFF'), named color (e.g. 'white'), or rgba().
text-alignstring (enum)centerHorizontal text alignment within the text box. Values: left, center, right
vertical-positionstring (enum)centerVertical position of the text block within the element area. Values: top, center, bottom
horizontal-positionstring (enum)centerHorizontal position of the text block within the element area. Values: left, center, right
text-shadowstringCSS text-shadow for readability over backgrounds (e.g. '2px 2px rgba(33,33,33,0.5)').
letter-spacingstringSpace between letters (e.g. '0.1em', '2px'). Useful for uppercase or wide-spaced designs.
line-heightstringLine height for multi-line text (e.g. '1.2em', '1.5').
marginstringMargin around the text block (e.g. '3vw', '20px').
background-colorstringBackground color behind each word/line of text. Especially effective with style 011 (text block).