Superhero half width variant with background image and video

Syntax

Optional controls, autoplay, and loop boolean attributes can be added on the opening tag when using the video slot (see Half Width parameters for descriptions).

<Superhero slots="fullWidthBackground, video, heading, text, buttons" variant="halfWidth" textColor="white" overGradient controls autoplay loop />

![Gradient background](../../../assets/vertical-gradient.png)

[video_url](../../../assets/example-video.mp4)

# Page Heading

This is a sample description text with an [inline link](https://example.com) for the superhero block.

* [Get Started](https://example.com/getting-started)
* [View Examples](https://example.com/examples)

data-slots=fullWidthBackground, video, heading, text, buttons

data-variant=halfWidth

data-textColor=white

data-overGradient=

data-controls=

data-autoplay=

data-loop=

video_url

Page Heading

This is a sample description text with an inline link for the superhero block.

• Get Started
• View Examples