/
- Compound
- Accordion
- Content
- BenefitsSection
- Billboard
- ImageBackgroundCallToAction
- Primitives
- Button
- LegacyButton
- Color
- Columns
- GridContainer
- Popover
- Stack
- StyledLink
- Typography
- Hero
- CenteredHero
- GifBackgroundHero
- SimpleHero
- SplitHero
- StandardHero
- VideoBackgroundHero
- Dialog
- EmailSignupDialog
- Promo
- OfferBox
- SimpleBanner
- Merchandise
- ProductCard
- Shop
- ShopSection
- ShopSectionNew
- App Portrayal
- SleepRoutineTabsSection
- Interactions
- Toast
- Docs
- Working with DatoCMS
- Magic Link Authentication Flow
- Comprehensive Next.js Authentication Flow
<StandardHero> Component
Code Editor
<StandardHeroheading={<span>Bedtime just<br />got more magical</span>}text="Make sleep magically simple with bedtime routines that grow with your child"image={{url: 'https://www.datocms-assets.com/98401/1681256547-rest-family-hero-desktop.jpg',alt: `Side table with sheep stuffed animal and toys and decor and a lit up Rest+ 2nd gen next to a Rest 2nd gen`,}}mobileImage={{url: 'https://www.datocms-assets.com/98401/1681256546-rest-family-hero-mobile.jpg',alt: `Side table with sheep stuffed animal and toys and decor and a lit up Rest+ 2nd gen next to a Rest 2nd gen`,}}cta={{ href: '/rest-plus-second-gen', text: 'Shop now' }}/>
With secondaryCta
Code Editor
<StandardHeroheading={<span>Bedtime just<br />got more magical</span>}text="Make sleep magically simple with bedtime routines that grow with your child"image={{url: 'https://www.datocms-assets.com/98401/1681256547-rest-family-hero-desktop.jpg',alt: `Side table with sheep stuffed animal and toys and decor and a lit up Rest+ 2nd gen next to a Rest 2nd gen`,}}mobileImage={{url: 'https://www.datocms-assets.com/98401/1681256546-rest-family-hero-mobile.jpg',alt: `Side table with sheep stuffed animal and toys and decor and a lit up Rest+ 2nd gen next to a Rest 2nd gen`,}}cta={{ href: '/rest-plus-second-gen', text: 'Shop now' }}secondaryCta={{ href: '/shop-all', text: 'Shop all' }}/>
With centered content
Code Editor
<StandardHeroheading={<span>Bedtime just<br />got more magical</span>}contentAlignment={{ justifyContent: 'center' }}text="Make sleep magically simple with bedtime routines that grow with your child"image={{url: 'https://www.datocms-assets.com/98401/1681256547-rest-family-hero-desktop.jpg',alt: `Side table with sheep stuffed animal and toys and decor and a lit up Rest+ 2nd gen next to a Rest 2nd gen`,}}mobileImage={{url: 'https://www.datocms-assets.com/98401/1681256546-rest-family-hero-mobile.jpg',alt: `Side table with sheep stuffed animal and toys and decor and a lit up Rest+ 2nd gen next to a Rest 2nd gen`,}}cta={{ href: '/rest-plus-second-gen', text: 'Shop now' }}secondaryCta={{ href: '/shop-all', text: 'Shop all' }}/>
With Light theme
Code Editor
<StandardHeroheading={<span>Bedtime just<br />got more magical</span>}theme="light"text="Make sleep magically simple with bedtime routines that grow with your child"image={{url: 'https://www.datocms-assets.com/98401/1681256558-hp-hero-restore.jpg',alt: `Side table with sheep stuffed animal and toys and decor and a lit up Rest+ 2nd gen next to a Rest 2nd gen`,}}mobileImage={{url: 'https://www.datocms-assets.com/98401/1681256546-rest-family-hero-mobile.jpg',alt: `Side table with sheep stuffed animal and toys and decor and a lit up Rest+ 2nd gen next to a Rest 2nd gen`,}}cta={{ href: '/rest-plus-second-gen', text: 'Shop now' }}secondaryCta={{ href: '/shop-all', text: 'Shop all' }}/>