# Docs

- Overview
  - [Introduction](/docs): Copy-paste components for React Email, MJML React, and JSX Email that work with the shadcn CLI.
  - [Installation](/docs/installation): Install email components, blocks, themes, and font helpers from the emailcn registry.
  - [Theming](/docs/theming): Email themes and fonts for React Email, MJML React, and JSX Email.
  - [MCP](/docs/mcp): Learn how to use the shadcn MCP (Model Context Protocol) server with emailcn.
  - [Registry](/docs/registry): Learn how to use the emailcn registry with the shadcn CLI.
  - Changelog
    - [Changelog](/docs/changelog): Latest updates and announcements for emailcn.
- Themes
  - [Themes](/docs/themes): Here you can find all the email themes available in the library.
  - React Email
    - [Airbnb Theme](/docs/themes/react-email/airbnb): Theme inspired by Airbnb for React Email.
    - [Default Theme](/docs/themes/react-email/default): Clean, minimal theme with neutral colors for React Email.
    - [GitHub Theme](/docs/themes/react-email/github): GitHub-inspired theme for React Email.
    - [Linear Theme](/docs/themes/react-email/linear): Light theme with purple accents for React Email.
    - [Notion Theme](/docs/themes/react-email/notion): Clean theme inspired by Notion for React Email.
    - [Raycast Theme](/docs/themes/react-email/raycast): Theme inspired by Raycast for React Email.
    - [Slack Theme](/docs/themes/react-email/slack): Theme inspired by Slack for React Email.
    - [Stripe Theme](/docs/themes/react-email/stripe): Theme inspired by Stripe's branding for React Email.
    - [Twitch Theme](/docs/themes/react-email/twitch): Dark theme with purple accents for React Email.
    - [Vercel Theme](/docs/themes/react-email/vercel): Dark theme inspired by Vercel's design for React Email.
- Fonts
  - [Fonts](/docs/fonts): Here you can find all the email fonts available in the library.
- Components
  - [Components](/docs/components): Here you can find all the email components available in the library.
  - React Email
    - [React Email](/docs/components/react-email): Email components built with React Email
    - Marketing
      - [Marketing](/docs/components/react-email/marketing): Marketing components for campaigns, newsletters, and announcements.
      - Bento Grids
        - [Bento Grids](/docs/components/react-email/marketing/bento-grids): Bento Grids components and variants.
        - [Image Grid](/docs/components/react-email/marketing/bento-grids/bento-image-grid): Bento Image Grid rendered with email-safe, renderer-native components.
        - [Product Grid](/docs/components/react-email/marketing/bento-grids/bento-product-grid): Bento Product Grid rendered with email-safe, renderer-native components.
        - [Stats Grid](/docs/components/react-email/marketing/bento-grids/bento-stats-grid): Bento Stats Grid rendered with email-safe, renderer-native components.
      - Blog
        - [Blog](/docs/components/react-email/marketing/blog): Blog components and variants.
        - [Grid](/docs/components/react-email/marketing/blog/blog-grid): Blog Grid rendered with email-safe, renderer-native components.
        - [Horizontal Post](/docs/components/react-email/marketing/blog/horizontal-blog-post): Horizontal Blog Post rendered with email-safe, renderer-native components.
        - [Featured Post](/docs/components/react-email/marketing/blog/featured-blog-post): Featured Blog Post rendered with email-safe, renderer-native components.
        - [Podcast](/docs/components/react-email/marketing/blog/podcast-blog): Podcast Blog rendered with email-safe, renderer-native components.
      - [Content](/docs/components/react-email/marketing/content): Content rendered with email-safe, renderer-native components.
      - Coupons
        - [Coupons](/docs/components/react-email/marketing/coupons): Coupons components and variants.
        - [Card](/docs/components/react-email/marketing/coupons/card-coupons): Card Coupons rendered with email-safe, renderer-native components.
        - [Centered Text](/docs/components/react-email/marketing/coupons/coupons-with-centered-text): Coupons With Centered Text rendered with email-safe, renderer-native components.
        - [Content Overlay](/docs/components/react-email/marketing/coupons/coupons-with-content-overlayed): Coupons With Content Overlayed rendered with email-safe, renderer-native components.
      - Cta
        - [Cta](/docs/components/react-email/marketing/cta): Cta components and variants.
        - [Basic](/docs/components/react-email/marketing/cta/call-to-action): Call To Action rendered with email-safe, renderer-native components.
        - [Background](/docs/components/react-email/marketing/cta/background-call-to-action): Background Call To Action rendered with email-safe, renderer-native components.
        - [Top Image](/docs/components/react-email/marketing/cta/top-image-call-to-action): Top Image Call To Action rendered with email-safe, renderer-native components.
        - [Image Strip](/docs/components/react-email/marketing/cta/image-strip-call-to-action): Image Strip Call To Action rendered with email-safe, renderer-native components.
        - [Collage](/docs/components/react-email/marketing/cta/collage-call-to-action): Collage Call To Action rendered with email-safe, renderer-native components.
        - [Avatars](/docs/components/react-email/marketing/cta/avatar-call-to-action): Avatar Call To Action rendered with email-safe, renderer-native components.
      - [FAQ](/docs/components/react-email/marketing/faq): Faq rendered with email-safe, renderer-native components.
      - Feature
        - [Feature](/docs/components/react-email/marketing/feature): Feature components and variants.
        - [Image](/docs/components/react-email/marketing/feature/image-feature): Image Feature rendered with email-safe, renderer-native components.
        - [Product Images](/docs/components/react-email/marketing/feature/product-images-feature): Product Images Feature rendered with email-safe, renderer-native components.
        - [Portrait](/docs/components/react-email/marketing/feature/portrait-feature): Portrait Feature rendered with email-safe, renderer-native components.
        - [Tall Background Images](/docs/components/react-email/marketing/feature/tall-background-images-feature): Tall Background Images Feature rendered with email-safe, renderer-native components.
      - Footers
        - [Footers](/docs/components/react-email/marketing/footers): Footers components and variants.
        - [Navigation](/docs/components/react-email/marketing/footers/navigation-footer): Navigation Footer rendered with email-safe, renderer-native components.
        - [Promotion](/docs/components/react-email/marketing/footers/promotion-footer): Promotion Footer rendered with email-safe, renderer-native components.
        - [Utility](/docs/components/react-email/marketing/footers/utility-footer): Utility Footer rendered with email-safe, renderer-native components.
      - Headers
        - [Headers](/docs/components/react-email/marketing/headers): Headers components and variants.
        - [Logo](/docs/components/react-email/marketing/headers/header-with-logo): Header With Logo rendered with email-safe, renderer-native components.
        - [Badge](/docs/components/react-email/marketing/headers/header-with-logo-and-badge): Header With Logo And Badge rendered with email-safe, renderer-native components.
        - [Finance Stats](/docs/components/react-email/marketing/headers/header-with-logo-and-finance-stats): Header With Logo And Finance Stats rendered with email-safe, renderer-native components.
        - [Menu](/docs/components/react-email/marketing/headers/header-with-logo-and-menu): Header With Logo And Menu rendered with email-safe, renderer-native components.
        - [Social Icons](/docs/components/react-email/marketing/headers/header-with-logo-and-social-icons): Header With Logo And Social Icons rendered with email-safe, renderer-native components.
        - [User Details](/docs/components/react-email/marketing/headers/header-with-user-details): Header With User Details rendered with email-safe, renderer-native components.
      - Heroes
        - [Heroes](/docs/components/react-email/marketing/heroes): Heroes components and variants.
        - [Overlay](/docs/components/react-email/marketing/heroes/overlay-hero): Overlay Hero rendered with email-safe, renderer-native components.
        - [Split](/docs/components/react-email/marketing/heroes/split-hero): Split Hero rendered with email-safe, renderer-native components.
        - [Image Grid](/docs/components/react-email/marketing/heroes/image-grid-hero): Image Grid Hero rendered with email-safe, renderer-native components.
        - [Overlap](/docs/components/react-email/marketing/heroes/overlap-hero): Overlap Hero rendered with email-safe, renderer-native components.
      - Images
        - [Images](/docs/components/react-email/marketing/images): Images components and variants.
        - [Grid](/docs/components/react-email/marketing/images/image-grid): Image Grid rendered with email-safe, renderer-native components.
        - [Featured Grid](/docs/components/react-email/marketing/images/featured-image-grid): Featured Image Grid rendered with email-safe, renderer-native components.
        - [Masonry Grid](/docs/components/react-email/marketing/images/masonry-image-grid): Masonry Image Grid rendered with email-safe, renderer-native components.
        - [Full Width](/docs/components/react-email/marketing/images/full-width-image): Full Width Image rendered with email-safe, renderer-native components.
      - [Logo Cloud](/docs/components/react-email/marketing/logo-cloud): Logo Cloud rendered with email-safe, renderer-native components.
      - Pricing
        - [Pricing](/docs/components/react-email/marketing/pricing): Pricing components and variants.
        - [Subscription](/docs/components/react-email/marketing/pricing/subscription-pricing): Subscription Pricing rendered with email-safe, renderer-native components.
        - [Purchase](/docs/components/react-email/marketing/pricing/purchase-pricing): Purchase Pricing rendered with email-safe, renderer-native components.
      - [Social Links](/docs/components/react-email/marketing/social-links): Social Links rendered with email-safe, renderer-native components.
      - Stats
        - [Stats](/docs/components/react-email/marketing/stats): Stats components and variants.
        - [Collection](/docs/components/react-email/marketing/stats/collection-stats): Collection Stats rendered with email-safe, renderer-native components.
        - [Spotlight](/docs/components/react-email/marketing/stats/spotlight-stats): Spotlight Stats rendered with email-safe, renderer-native components.
        - [Milestone](/docs/components/react-email/marketing/stats/milestone-stats): Milestone Stats rendered with email-safe, renderer-native components.
        - [Stacked](/docs/components/react-email/marketing/stats/stacked-stats): Stacked Stats rendered with email-safe, renderer-native components.
      - [Team](/docs/components/react-email/marketing/team): Team rendered with email-safe, renderer-native components.
      - [Testimonial](/docs/components/react-email/marketing/testimonial): Testimonial rendered with email-safe, renderer-native components.
      - Timelines
        - [Timelines](/docs/components/react-email/marketing/timelines): Timelines components and variants.
        - [General](/docs/components/react-email/marketing/timelines/timeline): Timeline rendered with email-safe, renderer-native components.
        - [Payment](/docs/components/react-email/marketing/timelines/payment-timeline): Payment Timeline rendered with email-safe, renderer-native components.
    - Ecommerce
      - [Ecommerce](/docs/components/react-email/ecommerce): Ecommerce components for product, cart, order, and review emails.
      - [Category Preview](/docs/components/react-email/ecommerce/category-preview): Category Preview rendered with email-safe, renderer-native components.
      - Order Summary
        - [Order Summary](/docs/components/react-email/ecommerce/order-summary): Order Summary components and variants.
        - [Table](/docs/components/react-email/ecommerce/order-summary/order-summary-table): Order Summary Table rendered with email-safe, renderer-native components.
        - [Billing Details](/docs/components/react-email/ecommerce/order-summary/billing-order-summary): Billing Order Summary rendered with email-safe, renderer-native components.
      - Product Detail
        - [Product Detail](/docs/components/react-email/ecommerce/product-detail): Product Detail components and variants.
        - [Single Image](/docs/components/react-email/ecommerce/product-detail/single-image-product-detail): Single Image Product Detail rendered with email-safe, renderer-native components.
        - [Two Images](/docs/components/react-email/ecommerce/product-detail/two-image-product-detail): Two Image Product Detail rendered with email-safe, renderer-native components.
        - [Three Images](/docs/components/react-email/ecommerce/product-detail/three-image-product-detail): Three Image Product Detail rendered with email-safe, renderer-native components.
        - [Masonry Images](/docs/components/react-email/ecommerce/product-detail/masonry-product-detail): Masonry Product Detail rendered with email-safe, renderer-native components.
        - [Split](/docs/components/react-email/ecommerce/product-detail/split-product-detail): Split Product Detail rendered with email-safe, renderer-native components.
      - [Product List](/docs/components/react-email/ecommerce/product-list): Product List rendered with email-safe, renderer-native components.
      - [Shopping Cart](/docs/components/react-email/ecommerce/shopping-cart): Shopping Cart rendered with email-safe, renderer-native components.
      - [Reviews](/docs/components/react-email/ecommerce/reviews): Reviews rendered with email-safe, renderer-native components.
    - UI Elements
      - [UI Elements](/docs/components/react-email/ui-elements): Composable email-safe UI elements.
      - Avatars
        - [Avatars](/docs/components/react-email/ui-elements/avatars): Avatars components and variants.
        - [Group](/docs/components/react-email/ui-elements/avatars/avatar-group): Avatar Group rendered with email-safe, renderer-native components.
        - [Details](/docs/components/react-email/ui-elements/avatars/avatar-details): Avatar Details rendered with email-safe, renderer-native components.
      - [Button](/docs/components/react-email/ui-elements/button): Button rendered with email-safe, renderer-native components.
      - [Container](/docs/components/react-email/ui-elements/container): Container rendered with email-safe, renderer-native components.
      - [Data Table](/docs/components/react-email/ui-elements/data-table): Data Table rendered with email-safe, renderer-native components.
      - [Grid](/docs/components/react-email/ui-elements/grid): Grid rendered with email-safe, renderer-native components.
      - [Pills](/docs/components/react-email/ui-elements/pills): Pills rendered with email-safe, renderer-native components.
      - [Progress](/docs/components/react-email/ui-elements/progress): Progress rendered with email-safe, renderer-native components.
      - Spacing
        - [Spacing](/docs/components/react-email/ui-elements/spacing): Spacing components and variants.
        - [Divider](/docs/components/react-email/ui-elements/spacing/divider): Divider rendered with email-safe, renderer-native components.
        - [Spacer](/docs/components/react-email/ui-elements/spacing/spacer): Spacer rendered with email-safe, renderer-native components.
  - MJML React
    - [React Email](/docs/components/mjml-react): Email components built with React Email
    - Marketing
      - [Marketing](/docs/components/mjml-react/marketing): Marketing components for campaigns, newsletters, and announcements.
      - Bento Grids
        - [Bento Grids](/docs/components/mjml-react/marketing/bento-grids): Bento Grids components and variants.
        - [Image Grid](/docs/components/mjml-react/marketing/bento-grids/bento-image-grid): Bento Image Grid rendered with email-safe, renderer-native components.
        - [Product Grid](/docs/components/mjml-react/marketing/bento-grids/bento-product-grid): Bento Product Grid rendered with email-safe, renderer-native components.
        - [Stats Grid](/docs/components/mjml-react/marketing/bento-grids/bento-stats-grid): Bento Stats Grid rendered with email-safe, renderer-native components.
      - Blog
        - [Blog](/docs/components/mjml-react/marketing/blog): Blog components and variants.
        - [Grid](/docs/components/mjml-react/marketing/blog/blog-grid): Blog Grid rendered with email-safe, renderer-native components.
        - [Horizontal Post](/docs/components/mjml-react/marketing/blog/horizontal-blog-post): Horizontal Blog Post rendered with email-safe, renderer-native components.
        - [Featured Post](/docs/components/mjml-react/marketing/blog/featured-blog-post): Featured Blog Post rendered with email-safe, renderer-native components.
        - [Podcast](/docs/components/mjml-react/marketing/blog/podcast-blog): Podcast Blog rendered with email-safe, renderer-native components.
      - [Content](/docs/components/mjml-react/marketing/content): Content rendered with email-safe, renderer-native components.
      - Coupons
        - [Coupons](/docs/components/mjml-react/marketing/coupons): Coupons components and variants.
        - [Card](/docs/components/mjml-react/marketing/coupons/card-coupons): Card Coupons rendered with email-safe, renderer-native components.
        - [Centered Text](/docs/components/mjml-react/marketing/coupons/coupons-with-centered-text): Coupons With Centered Text rendered with email-safe, renderer-native components.
        - [Content Overlay](/docs/components/mjml-react/marketing/coupons/coupons-with-content-overlayed): Coupons With Content Overlayed rendered with email-safe, renderer-native components.
      - Cta
        - [Cta](/docs/components/mjml-react/marketing/cta): Cta components and variants.
        - [Basic](/docs/components/mjml-react/marketing/cta/call-to-action): Call To Action rendered with email-safe, renderer-native components.
        - [Background](/docs/components/mjml-react/marketing/cta/background-call-to-action): Background Call To Action rendered with email-safe, renderer-native components.
        - [Top Image](/docs/components/mjml-react/marketing/cta/top-image-call-to-action): Top Image Call To Action rendered with email-safe, renderer-native components.
        - [Image Strip](/docs/components/mjml-react/marketing/cta/image-strip-call-to-action): Image Strip Call To Action rendered with email-safe, renderer-native components.
        - [Collage](/docs/components/mjml-react/marketing/cta/collage-call-to-action): Collage Call To Action rendered with email-safe, renderer-native components.
        - [Avatars](/docs/components/mjml-react/marketing/cta/avatar-call-to-action): Avatar Call To Action rendered with email-safe, renderer-native components.
      - [FAQ](/docs/components/mjml-react/marketing/faq): Faq rendered with email-safe, renderer-native components.
      - Feature
        - [Feature](/docs/components/mjml-react/marketing/feature): Feature components and variants.
        - [Image](/docs/components/mjml-react/marketing/feature/image-feature): Image Feature rendered with email-safe, renderer-native components.
        - [Product Images](/docs/components/mjml-react/marketing/feature/product-images-feature): Product Images Feature rendered with email-safe, renderer-native components.
        - [Portrait](/docs/components/mjml-react/marketing/feature/portrait-feature): Portrait Feature rendered with email-safe, renderer-native components.
        - [Tall Background Images](/docs/components/mjml-react/marketing/feature/tall-background-images-feature): Tall Background Images Feature rendered with email-safe, renderer-native components.
      - Footers
        - [Footers](/docs/components/mjml-react/marketing/footers): Footers components and variants.
        - [Navigation](/docs/components/mjml-react/marketing/footers/navigation-footer): Navigation Footer rendered with email-safe, renderer-native components.
        - [Promotion](/docs/components/mjml-react/marketing/footers/promotion-footer): Promotion Footer rendered with email-safe, renderer-native components.
        - [Utility](/docs/components/mjml-react/marketing/footers/utility-footer): Utility Footer rendered with email-safe, renderer-native components.
      - Headers
        - [Headers](/docs/components/mjml-react/marketing/headers): Headers components and variants.
        - [Logo](/docs/components/mjml-react/marketing/headers/header-with-logo): Header With Logo rendered with email-safe, renderer-native components.
        - [Badge](/docs/components/mjml-react/marketing/headers/header-with-logo-and-badge): Header With Logo And Badge rendered with email-safe, renderer-native components.
        - [Finance Stats](/docs/components/mjml-react/marketing/headers/header-with-logo-and-finance-stats): Header With Logo And Finance Stats rendered with email-safe, renderer-native components.
        - [Menu](/docs/components/mjml-react/marketing/headers/header-with-logo-and-menu): Header With Logo And Menu rendered with email-safe, renderer-native components.
        - [Social Icons](/docs/components/mjml-react/marketing/headers/header-with-logo-and-social-icons): Header With Logo And Social Icons rendered with email-safe, renderer-native components.
        - [User Details](/docs/components/mjml-react/marketing/headers/header-with-user-details): Header With User Details rendered with email-safe, renderer-native components.
      - Heroes
        - [Heroes](/docs/components/mjml-react/marketing/heroes): Heroes components and variants.
        - [Overlay](/docs/components/mjml-react/marketing/heroes/overlay-hero): Overlay Hero rendered with email-safe, renderer-native components.
        - [Split](/docs/components/mjml-react/marketing/heroes/split-hero): Split Hero rendered with email-safe, renderer-native components.
        - [Image Grid](/docs/components/mjml-react/marketing/heroes/image-grid-hero): Image Grid Hero rendered with email-safe, renderer-native components.
        - [Overlap](/docs/components/mjml-react/marketing/heroes/overlap-hero): Overlap Hero rendered with email-safe, renderer-native components.
      - Images
        - [Images](/docs/components/mjml-react/marketing/images): Images components and variants.
        - [Grid](/docs/components/mjml-react/marketing/images/image-grid): Image Grid rendered with email-safe, renderer-native components.
        - [Featured Grid](/docs/components/mjml-react/marketing/images/featured-image-grid): Featured Image Grid rendered with email-safe, renderer-native components.
        - [Masonry Grid](/docs/components/mjml-react/marketing/images/masonry-image-grid): Masonry Image Grid rendered with email-safe, renderer-native components.
        - [Full Width](/docs/components/mjml-react/marketing/images/full-width-image): Full Width Image rendered with email-safe, renderer-native components.
      - [Logo Cloud](/docs/components/mjml-react/marketing/logo-cloud): Logo Cloud rendered with email-safe, renderer-native components.
      - Pricing
        - [Pricing](/docs/components/mjml-react/marketing/pricing): Pricing components and variants.
        - [Subscription](/docs/components/mjml-react/marketing/pricing/subscription-pricing): Subscription Pricing rendered with email-safe, renderer-native components.
        - [Purchase](/docs/components/mjml-react/marketing/pricing/purchase-pricing): Purchase Pricing rendered with email-safe, renderer-native components.
      - [Social Links](/docs/components/mjml-react/marketing/social-links): Social Links rendered with email-safe, renderer-native components.
      - Stats
        - [Stats](/docs/components/mjml-react/marketing/stats): Stats components and variants.
        - [Collection](/docs/components/mjml-react/marketing/stats/collection-stats): Collection Stats rendered with email-safe, renderer-native components.
        - [Spotlight](/docs/components/mjml-react/marketing/stats/spotlight-stats): Spotlight Stats rendered with email-safe, renderer-native components.
        - [Milestone](/docs/components/mjml-react/marketing/stats/milestone-stats): Milestone Stats rendered with email-safe, renderer-native components.
        - [Stacked](/docs/components/mjml-react/marketing/stats/stacked-stats): Stacked Stats rendered with email-safe, renderer-native components.
      - [Team](/docs/components/mjml-react/marketing/team): Team rendered with email-safe, renderer-native components.
      - [Testimonial](/docs/components/mjml-react/marketing/testimonial): Testimonial rendered with email-safe, renderer-native components.
      - Timelines
        - [Timelines](/docs/components/mjml-react/marketing/timelines): Timelines components and variants.
        - [General](/docs/components/mjml-react/marketing/timelines/timeline): Timeline rendered with email-safe, renderer-native components.
        - [Payment](/docs/components/mjml-react/marketing/timelines/payment-timeline): Payment Timeline rendered with email-safe, renderer-native components.
    - Ecommerce
      - [Ecommerce](/docs/components/mjml-react/ecommerce): Ecommerce components for product, cart, order, and review emails.
      - [Category Preview](/docs/components/mjml-react/ecommerce/category-preview): Category Preview rendered with email-safe, renderer-native components.
      - Order Summary
        - [Order Summary](/docs/components/mjml-react/ecommerce/order-summary): Order Summary components and variants.
        - [Table](/docs/components/mjml-react/ecommerce/order-summary/order-summary-table): Order Summary Table rendered with email-safe, renderer-native components.
        - [Billing Details](/docs/components/mjml-react/ecommerce/order-summary/billing-order-summary): Billing Order Summary rendered with email-safe, renderer-native components.
      - Product Detail
        - [Product Detail](/docs/components/mjml-react/ecommerce/product-detail): Product Detail components and variants.
        - [Single Image](/docs/components/mjml-react/ecommerce/product-detail/single-image-product-detail): Single Image Product Detail rendered with email-safe, renderer-native components.
        - [Two Images](/docs/components/mjml-react/ecommerce/product-detail/two-image-product-detail): Two Image Product Detail rendered with email-safe, renderer-native components.
        - [Three Images](/docs/components/mjml-react/ecommerce/product-detail/three-image-product-detail): Three Image Product Detail rendered with email-safe, renderer-native components.
        - [Masonry Images](/docs/components/mjml-react/ecommerce/product-detail/masonry-product-detail): Masonry Product Detail rendered with email-safe, renderer-native components.
        - [Split](/docs/components/mjml-react/ecommerce/product-detail/split-product-detail): Split Product Detail rendered with email-safe, renderer-native components.
      - [Product List](/docs/components/mjml-react/ecommerce/product-list): Product List rendered with email-safe, renderer-native components.
      - [Shopping Cart](/docs/components/mjml-react/ecommerce/shopping-cart): Shopping Cart rendered with email-safe, renderer-native components.
      - [Reviews](/docs/components/mjml-react/ecommerce/reviews): Reviews rendered with email-safe, renderer-native components.
    - UI Elements
      - [UI Elements](/docs/components/mjml-react/ui-elements): Composable email-safe UI elements.
      - Avatars
        - [Avatars](/docs/components/mjml-react/ui-elements/avatars): Avatars components and variants.
        - [Group](/docs/components/mjml-react/ui-elements/avatars/avatar-group): Avatar Group rendered with email-safe, renderer-native components.
        - [Details](/docs/components/mjml-react/ui-elements/avatars/avatar-details): Avatar Details rendered with email-safe, renderer-native components.
      - [Button](/docs/components/mjml-react/ui-elements/button): Button rendered with email-safe, renderer-native components.
      - [Container](/docs/components/mjml-react/ui-elements/container): Container rendered with email-safe, renderer-native components.
      - [Data Table](/docs/components/mjml-react/ui-elements/data-table): Data Table rendered with email-safe, renderer-native components.
      - [Grid](/docs/components/mjml-react/ui-elements/grid): Grid rendered with email-safe, renderer-native components.
      - [Pills](/docs/components/mjml-react/ui-elements/pills): Pills rendered with email-safe, renderer-native components.
      - [Progress](/docs/components/mjml-react/ui-elements/progress): Progress rendered with email-safe, renderer-native components.
      - Spacing
        - [Spacing](/docs/components/mjml-react/ui-elements/spacing): Spacing components and variants.
        - [Divider](/docs/components/mjml-react/ui-elements/spacing/divider): Divider rendered with email-safe, renderer-native components.
        - [Spacer](/docs/components/mjml-react/ui-elements/spacing/spacer): Spacer rendered with email-safe, renderer-native components.
  - JSX Email
    - [React Email](/docs/components/jsx-email): Email components built with React Email
    - Marketing
      - [Marketing](/docs/components/jsx-email/marketing): Marketing components for campaigns, newsletters, and announcements.
      - Bento Grids
        - [Bento Grids](/docs/components/jsx-email/marketing/bento-grids): Bento Grids components and variants.
        - [Image Grid](/docs/components/jsx-email/marketing/bento-grids/bento-image-grid): Bento Image Grid rendered with email-safe, renderer-native components.
        - [Product Grid](/docs/components/jsx-email/marketing/bento-grids/bento-product-grid): Bento Product Grid rendered with email-safe, renderer-native components.
        - [Stats Grid](/docs/components/jsx-email/marketing/bento-grids/bento-stats-grid): Bento Stats Grid rendered with email-safe, renderer-native components.
      - Blog
        - [Blog](/docs/components/jsx-email/marketing/blog): Blog components and variants.
        - [Grid](/docs/components/jsx-email/marketing/blog/blog-grid): Blog Grid rendered with email-safe, renderer-native components.
        - [Horizontal Post](/docs/components/jsx-email/marketing/blog/horizontal-blog-post): Horizontal Blog Post rendered with email-safe, renderer-native components.
        - [Featured Post](/docs/components/jsx-email/marketing/blog/featured-blog-post): Featured Blog Post rendered with email-safe, renderer-native components.
        - [Podcast](/docs/components/jsx-email/marketing/blog/podcast-blog): Podcast Blog rendered with email-safe, renderer-native components.
      - [Content](/docs/components/jsx-email/marketing/content): Content rendered with email-safe, renderer-native components.
      - Coupons
        - [Coupons](/docs/components/jsx-email/marketing/coupons): Coupons components and variants.
        - [Card](/docs/components/jsx-email/marketing/coupons/card-coupons): Card Coupons rendered with email-safe, renderer-native components.
        - [Centered Text](/docs/components/jsx-email/marketing/coupons/coupons-with-centered-text): Coupons With Centered Text rendered with email-safe, renderer-native components.
        - [Content Overlay](/docs/components/jsx-email/marketing/coupons/coupons-with-content-overlayed): Coupons With Content Overlayed rendered with email-safe, renderer-native components.
      - Cta
        - [Cta](/docs/components/jsx-email/marketing/cta): Cta components and variants.
        - [Basic](/docs/components/jsx-email/marketing/cta/call-to-action): Call To Action rendered with email-safe, renderer-native components.
        - [Background](/docs/components/jsx-email/marketing/cta/background-call-to-action): Background Call To Action rendered with email-safe, renderer-native components.
        - [Top Image](/docs/components/jsx-email/marketing/cta/top-image-call-to-action): Top Image Call To Action rendered with email-safe, renderer-native components.
        - [Image Strip](/docs/components/jsx-email/marketing/cta/image-strip-call-to-action): Image Strip Call To Action rendered with email-safe, renderer-native components.
        - [Collage](/docs/components/jsx-email/marketing/cta/collage-call-to-action): Collage Call To Action rendered with email-safe, renderer-native components.
        - [Avatars](/docs/components/jsx-email/marketing/cta/avatar-call-to-action): Avatar Call To Action rendered with email-safe, renderer-native components.
      - [FAQ](/docs/components/jsx-email/marketing/faq): Faq rendered with email-safe, renderer-native components.
      - Feature
        - [Feature](/docs/components/jsx-email/marketing/feature): Feature components and variants.
        - [Image](/docs/components/jsx-email/marketing/feature/image-feature): Image Feature rendered with email-safe, renderer-native components.
        - [Product Images](/docs/components/jsx-email/marketing/feature/product-images-feature): Product Images Feature rendered with email-safe, renderer-native components.
        - [Portrait](/docs/components/jsx-email/marketing/feature/portrait-feature): Portrait Feature rendered with email-safe, renderer-native components.
        - [Tall Background Images](/docs/components/jsx-email/marketing/feature/tall-background-images-feature): Tall Background Images Feature rendered with email-safe, renderer-native components.
      - Footers
        - [Footers](/docs/components/jsx-email/marketing/footers): Footers components and variants.
        - [Navigation](/docs/components/jsx-email/marketing/footers/navigation-footer): Navigation Footer rendered with email-safe, renderer-native components.
        - [Promotion](/docs/components/jsx-email/marketing/footers/promotion-footer): Promotion Footer rendered with email-safe, renderer-native components.
        - [Utility](/docs/components/jsx-email/marketing/footers/utility-footer): Utility Footer rendered with email-safe, renderer-native components.
      - Headers
        - [Headers](/docs/components/jsx-email/marketing/headers): Headers components and variants.
        - [Logo](/docs/components/jsx-email/marketing/headers/header-with-logo): Header With Logo rendered with email-safe, renderer-native components.
        - [Badge](/docs/components/jsx-email/marketing/headers/header-with-logo-and-badge): Header With Logo And Badge rendered with email-safe, renderer-native components.
        - [Finance Stats](/docs/components/jsx-email/marketing/headers/header-with-logo-and-finance-stats): Header With Logo And Finance Stats rendered with email-safe, renderer-native components.
        - [Menu](/docs/components/jsx-email/marketing/headers/header-with-logo-and-menu): Header With Logo And Menu rendered with email-safe, renderer-native components.
        - [Social Icons](/docs/components/jsx-email/marketing/headers/header-with-logo-and-social-icons): Header With Logo And Social Icons rendered with email-safe, renderer-native components.
        - [User Details](/docs/components/jsx-email/marketing/headers/header-with-user-details): Header With User Details rendered with email-safe, renderer-native components.
      - Heroes
        - [Heroes](/docs/components/jsx-email/marketing/heroes): Heroes components and variants.
        - [Overlay](/docs/components/jsx-email/marketing/heroes/overlay-hero): Overlay Hero rendered with email-safe, renderer-native components.
        - [Split](/docs/components/jsx-email/marketing/heroes/split-hero): Split Hero rendered with email-safe, renderer-native components.
        - [Image Grid](/docs/components/jsx-email/marketing/heroes/image-grid-hero): Image Grid Hero rendered with email-safe, renderer-native components.
        - [Overlap](/docs/components/jsx-email/marketing/heroes/overlap-hero): Overlap Hero rendered with email-safe, renderer-native components.
      - Images
        - [Images](/docs/components/jsx-email/marketing/images): Images components and variants.
        - [Grid](/docs/components/jsx-email/marketing/images/image-grid): Image Grid rendered with email-safe, renderer-native components.
        - [Featured Grid](/docs/components/jsx-email/marketing/images/featured-image-grid): Featured Image Grid rendered with email-safe, renderer-native components.
        - [Masonry Grid](/docs/components/jsx-email/marketing/images/masonry-image-grid): Masonry Image Grid rendered with email-safe, renderer-native components.
        - [Full Width](/docs/components/jsx-email/marketing/images/full-width-image): Full Width Image rendered with email-safe, renderer-native components.
      - [Logo Cloud](/docs/components/jsx-email/marketing/logo-cloud): Logo Cloud rendered with email-safe, renderer-native components.
      - Pricing
        - [Pricing](/docs/components/jsx-email/marketing/pricing): Pricing components and variants.
        - [Subscription](/docs/components/jsx-email/marketing/pricing/subscription-pricing): Subscription Pricing rendered with email-safe, renderer-native components.
        - [Purchase](/docs/components/jsx-email/marketing/pricing/purchase-pricing): Purchase Pricing rendered with email-safe, renderer-native components.
      - [Social Links](/docs/components/jsx-email/marketing/social-links): Social Links rendered with email-safe, renderer-native components.
      - Stats
        - [Stats](/docs/components/jsx-email/marketing/stats): Stats components and variants.
        - [Collection](/docs/components/jsx-email/marketing/stats/collection-stats): Collection Stats rendered with email-safe, renderer-native components.
        - [Spotlight](/docs/components/jsx-email/marketing/stats/spotlight-stats): Spotlight Stats rendered with email-safe, renderer-native components.
        - [Milestone](/docs/components/jsx-email/marketing/stats/milestone-stats): Milestone Stats rendered with email-safe, renderer-native components.
        - [Stacked](/docs/components/jsx-email/marketing/stats/stacked-stats): Stacked Stats rendered with email-safe, renderer-native components.
      - [Team](/docs/components/jsx-email/marketing/team): Team rendered with email-safe, renderer-native components.
      - [Testimonial](/docs/components/jsx-email/marketing/testimonial): Testimonial rendered with email-safe, renderer-native components.
      - Timelines
        - [Timelines](/docs/components/jsx-email/marketing/timelines): Timelines components and variants.
        - [General](/docs/components/jsx-email/marketing/timelines/timeline): Timeline rendered with email-safe, renderer-native components.
        - [Payment](/docs/components/jsx-email/marketing/timelines/payment-timeline): Payment Timeline rendered with email-safe, renderer-native components.
    - Ecommerce
      - [Ecommerce](/docs/components/jsx-email/ecommerce): Ecommerce components for product, cart, order, and review emails.
      - [Category Preview](/docs/components/jsx-email/ecommerce/category-preview): Category Preview rendered with email-safe, renderer-native components.
      - Order Summary
        - [Order Summary](/docs/components/jsx-email/ecommerce/order-summary): Order Summary components and variants.
        - [Table](/docs/components/jsx-email/ecommerce/order-summary/order-summary-table): Order Summary Table rendered with email-safe, renderer-native components.
        - [Billing Details](/docs/components/jsx-email/ecommerce/order-summary/billing-order-summary): Billing Order Summary rendered with email-safe, renderer-native components.
      - Product Detail
        - [Product Detail](/docs/components/jsx-email/ecommerce/product-detail): Product Detail components and variants.
        - [Single Image](/docs/components/jsx-email/ecommerce/product-detail/single-image-product-detail): Single Image Product Detail rendered with email-safe, renderer-native components.
        - [Two Images](/docs/components/jsx-email/ecommerce/product-detail/two-image-product-detail): Two Image Product Detail rendered with email-safe, renderer-native components.
        - [Three Images](/docs/components/jsx-email/ecommerce/product-detail/three-image-product-detail): Three Image Product Detail rendered with email-safe, renderer-native components.
        - [Masonry Images](/docs/components/jsx-email/ecommerce/product-detail/masonry-product-detail): Masonry Product Detail rendered with email-safe, renderer-native components.
        - [Split](/docs/components/jsx-email/ecommerce/product-detail/split-product-detail): Split Product Detail rendered with email-safe, renderer-native components.
      - [Product List](/docs/components/jsx-email/ecommerce/product-list): Product List rendered with email-safe, renderer-native components.
      - [Shopping Cart](/docs/components/jsx-email/ecommerce/shopping-cart): Shopping Cart rendered with email-safe, renderer-native components.
      - [Reviews](/docs/components/jsx-email/ecommerce/reviews): Reviews rendered with email-safe, renderer-native components.
    - UI Elements
      - [UI Elements](/docs/components/jsx-email/ui-elements): Composable email-safe UI elements.
      - Avatars
        - [Avatars](/docs/components/jsx-email/ui-elements/avatars): Avatars components and variants.
        - [Group](/docs/components/jsx-email/ui-elements/avatars/avatar-group): Avatar Group rendered with email-safe, renderer-native components.
        - [Details](/docs/components/jsx-email/ui-elements/avatars/avatar-details): Avatar Details rendered with email-safe, renderer-native components.
      - [Button](/docs/components/jsx-email/ui-elements/button): Button rendered with email-safe, renderer-native components.
      - [Container](/docs/components/jsx-email/ui-elements/container): Container rendered with email-safe, renderer-native components.
      - [Data Table](/docs/components/jsx-email/ui-elements/data-table): Data Table rendered with email-safe, renderer-native components.
      - [Grid](/docs/components/jsx-email/ui-elements/grid): Grid rendered with email-safe, renderer-native components.
      - [Pills](/docs/components/jsx-email/ui-elements/pills): Pills rendered with email-safe, renderer-native components.
      - [Progress](/docs/components/jsx-email/ui-elements/progress): Progress rendered with email-safe, renderer-native components.
      - Spacing
        - [Spacing](/docs/components/jsx-email/ui-elements/spacing): Spacing components and variants.
        - [Divider](/docs/components/jsx-email/ui-elements/spacing/divider): Divider rendered with email-safe, renderer-native components.
        - [Spacer](/docs/components/jsx-email/ui-elements/spacing/spacer): Spacer rendered with email-safe, renderer-native components.
- Blocks
  - [Blocks](/docs/blocks): Here you can find all the email blocks available in the library.
  - React Email
    - [React Email Blocks](/docs/blocks/react-email): Email blocks built with React Email
    - [Authentication Emails](/docs/blocks/react-email/authentication): Pre-built authentication email templates for various use cases.
    - [Notification Emails](/docs/blocks/react-email/notification): Pre-built notification email templates for various use cases.
    - [Newsletter Emails](/docs/blocks/react-email/newsletter): Pre-built newsletter email templates for updates and announcements.
    - [Invitation Emails](/docs/blocks/react-email/invites): Pre-built invitation email templates for team and project invites.
    - [Receipt Emails](/docs/blocks/react-email/receipts): Pre-built receipt and invoice email templates.
    - [Onboarding Emails](/docs/blocks/react-email/onboarding): Pre-built onboarding email templates for new users.
  - MJML React
    - [MJML React Blocks](/docs/blocks/mjml-react): Email blocks built with MJML React
    - [Authentication Emails](/docs/blocks/mjml-react/authentication): Pre-built authentication email templates for various use cases.
    - [Notification Emails](/docs/blocks/mjml-react/notification): Pre-built notification email templates for various use cases.
    - [Newsletter Emails](/docs/blocks/mjml-react/newsletter): Pre-built newsletter email templates for updates and announcements.
    - [Invitation Emails](/docs/blocks/mjml-react/invites): Pre-built invitation email templates for team and project invites.
    - [Receipt Emails](/docs/blocks/mjml-react/receipts): Pre-built receipt and invoice email templates.
    - [Onboarding Emails](/docs/blocks/mjml-react/onboarding): Pre-built onboarding email templates for new users.
  - JSX Email
    - [JSX Email Blocks](/docs/blocks/jsx-email): Email blocks built with JSX Email
    - [Authentication Emails](/docs/blocks/jsx-email/authentication): Pre-built authentication email templates for various use cases.
    - [Notification Emails](/docs/blocks/jsx-email/notification): Pre-built notification email templates for various use cases.
    - [Newsletter Emails](/docs/blocks/jsx-email/newsletter): Pre-built newsletter email templates for updates and announcements.
    - [Invitation Emails](/docs/blocks/jsx-email/invites): Pre-built invitation email templates for team and project invites.
    - [Receipt Emails](/docs/blocks/jsx-email/receipts): Pre-built receipt and invoice email templates.
    - [Onboarding Emails](/docs/blocks/jsx-email/onboarding): Pre-built onboarding email templates for new users.