Hero
Hero
Component demo
Interactive example
<ic-heroheading="Everything I brew, I brew it for you"subheading="This news is hot off the French press."><ic-buttonvariant="primary"slot="interaction">Explore</ic-button><ic-buttonvariant="secondary"slot="interaction"> Check out our new drinks </ic-button></ic-hero>
<IcHeroheading="Everything I brew, I brew it for you"subheading="This news is hot off the French press."><IcButtonvariant="primary"slot="interaction"> Explore</IcButton><IcButtonvariant="secondary"slot="interaction"> Check out our new drinks </IcButton></IcHero>
Hero details
Props
All components also accept native properties supported by the DOM, such asclassName
and
style
.
|
|
|
---|---|---|
|
The alignment of the hero. |
|
|
The optional background image. |
|
|
The alignment of the hero content. |
|
|
If |
|
|
The heading of the hero. |
|
|
The optional secondary heading, replaced by slotted right content. |
|
|
The optional secondary subheading, replaced by slotted right content. |
|
|
The size of the hero component. |
|
|
|
|
|
The description for the hero. |
|
The alignment of the hero. |
The optional background image. |
The alignment of the hero content. |
If |
|