Image stage - CSS Component

The ImageStage component can be used imported from:

Playground

The CSS component uses a sectiontag with the z-image-stageHTML custom attribute.

The z-image-stage parameter is the main parameter used to render the stage component.

The z-image-stage parameter accepts two modifiers, left and slim.

The left modifier is used to align the stage content to the left.

The slim modifier is used to reduce the padding of the stage content.

TIP

You can combine the left and slim modifiers to align the stage content to the left and reduce the padding. The pattern is config="left:slim".

The content of the Stage component is customizable. Check the stage anatomy guidelines for more details.

Also you can customize the background color of the stage component, using the --z-image-stage--bg CSS custom property.