Blocks

Pre-built, composable sections for building pages quickly.

SimpleNav

A simple navigation bar with logo and links.

Hero

A centered hero section with title and (optional) logo, tagline, description, and CTA buttons.

My App

Build Something Great

A short description of your amazing project.

FloatingHero

A hero with floating/gradient background effect.

Floating Hero

A hero with a subtle floating effect.

Footer

A simple footer with copyright and optional links.

BackLink

A back navigation link with arrow icon.

Blurb

A page title with description intro.

Page Title

A brief description of what this page is about.

Story

A narrative section with multiple paragraphs.

Our Story

This is the first paragraph of our story.

And this is the second paragraph with more details.

StripedSections

Alternating background sections.

Section One

This is the first section content.

Section Two

This is the second section content.

Features

A grid of feature cards with icons.

🚀

Fast

Lightning fast performance

🔒

Secure

Built with security in mind

🎨

Beautiful

Stunning UI out of the box

CTA

A call-to-action section.

Ready to get started?

Join thousands of happy customers today.

Get Started

Team

A team member grid with icons, names, roles, and bios.

Meet the Team

👩‍💻

Alice

Developer

Full-stack engineer

👨‍🎨

Bob

Designer

UI/UX specialist

CalloutGrid

A grid of callout items with icons.

Our Values

Feature One

Description of feature one

🎯

Feature Two

Description of feature two

Services

Service cards with icons, descriptions, and feature lists.

🏠

Web Development

Custom websites built to your needs.

  • • Responsive design
  • • SEO optimized
  • • Fast loading

CalloutNumbered

Numbered steps in a callout section.

How It Works

1

Plan

Define the scope

2

Build

Develop the solution

3

Launch

Deploy to production

EmojiList

A list with emoji icons, titles, and descriptions.

Contact Info

📧

Email

hello@example.com

📍

Location

San Francisco, CA

CalloutFAQ

A FAQ section with questions and answers.

FAQ

How does it work?

It just works!

Is it free?

Yes, open source.

Nav

The navigation bar you see at the top of this site. Includes authentication state handling, mobile responsive menu, and avatar dropdown.

Nav is already rendered in the root layout. See the navigation above for a live example.

AvatarMenu

A dropdown menu triggered by a user avatar, typically used for account actions.

AvatarMenu is used within Nav when a user is logged in. Sign in to see it in action.
cleanroom © 2025 cleanroom
Connected