Page builder blocks
The 20 blocks that ship with Avocado Studio, as React components from @avocadostudio-ai/blocks. The demo site that npm create avocado-site scaffolds is built from them. On an existing site your own components are registered as blocks instead — see the docs. The interactive catalogue, with live previews and editable props, loads here.
Hero
Full-width hero section with headline, subheading, CTA buttons, and image.
Feature Grid
Grid of feature cards with optional icon, title, and description.
Testimonials
Grid of testimonial cards with quotes and authors.
FAQ Accordion
Expandable question-and-answer section.
Call to Action
Centered promotional section with primary and optional secondary button.
Card
Single prominent card with a CTA.
Card Grid
Grid of cards, each with title, description, and CTA.
Rich Text
Freeform text content with markdown-style formatting.
Stats
Row of big numbers with labels (e.g. 10K+ Users).
Two Column
Composite two-column layout with typed child components in each column.
Embed
Embed external content — Google Maps, social media posts, or a custom iframe.
Banner
Full-width announcement or alert bar with optional call-to-action button.
Carousel
Image/content slideshow with prev/next navigation and dot indicators.
Gallery
Image grid with configurable columns and optional captions.
Tabs
Switchable tabbed content panels with rich text in each tab.
Table
Data table with column headers, rows, and optional stripe styling.
Quote
Pull quote or blockquote with optional author attribution and avatar.
Video
Video player — supports YouTube, Vimeo URLs, or direct video files (mp4, webm).
Footer
Multi-column footer with link groups and copyright.
Site Header
Global site navigation bar with logo, site name, and nav links.
Page builder blocks
The 20 blocks that ship with Avocado Studio, as React components from @avocadostudio-ai/blocks. The demo site that npm create avocado-site scaffolds is built from them. On an existing site your own components are registered as blocks instead — see the docs. The interactive catalogue, with live previews and editable props, loads here.
Hero
Full-width hero section with headline, subheading, CTA buttons, and image.
Feature Grid
Grid of feature cards with optional icon, title, and description.
Testimonials
Grid of testimonial cards with quotes and authors.
FAQ Accordion
Expandable question-and-answer section.
Call to Action
Centered promotional section with primary and optional secondary button.
Card
Single prominent card with a CTA.
Card Grid
Grid of cards, each with title, description, and CTA.
Rich Text
Freeform text content with markdown-style formatting.
Stats
Row of big numbers with labels (e.g. 10K+ Users).
Two Column
Composite two-column layout with typed child components in each column.
Embed
Embed external content — Google Maps, social media posts, or a custom iframe.
Banner
Full-width announcement or alert bar with optional call-to-action button.
Carousel
Image/content slideshow with prev/next navigation and dot indicators.
Gallery
Image grid with configurable columns and optional captions.
Tabs
Switchable tabbed content panels with rich text in each tab.
Table
Data table with column headers, rows, and optional stripe styling.
Quote
Pull quote or blockquote with optional author attribution and avatar.
Video
Video player — supports YouTube, Vimeo URLs, or direct video files (mp4, webm).
Footer
Multi-column footer with link groups and copyright.
Site Header
Global site navigation bar with logo, site name, and nav links.