Component library

82 components. One brand.

Every design is composed from this library: 43 website sections, 19 slide layouts and 20 app screens. Each one is responsive, checked for accessible contrast, and restyled by your colours and type in one click.

82 components

Placeholder eyebrow
A headline about what the product does
Two sentences of supporting copy written by the author. Nothing here is sourced or measured.
Start free
Overview tile
Detail tile
Mobile tile
Bento hero
Heroes
Centered minimal hero
Heroes
Editorial hero
Heroes
Media hero
Heroes
Product hero
Heroes
Split-media hero
Heroes
Three capabilities, explained
Each row pairs a short explanation with a labelled media placeholder.
Plan with structure
Describe one real capability in a paragraph. The placeholder beside it is illustrative.
Review together
Explain how the second capability helps. Alternating rows keep the page moving.
Ship with confidence
Close with the capability that matters most to the reader.
Alternating feature rows
Features
What you get
Lead feature
The one capability the page is built around, described in the author's words.
Second feature
A supporting capability.
Third feature
Another supporting capability.
Fourth feature
A smaller point worth a card.
Fifth feature
One more card to fill the grid.
Bento features
Features
From the blog
Placeholder date
First post title
A one-sentence excerpt written by the author.
Placeholder date
Second post title
Another excerpt; this post has no link yet.
Third post title
An excerpt without a meta line.
Blog list
Features
Example features
Plan
Describe one real capability.
Feature grid
Features
Also included
Fast
One line about speed.
Safe
One line about safety.
Clear
One line about clarity.
Open
One line about openness.
Icon-row features
Features

Why switch

Author-supplied comparison
Feature	This product	The usual approach
Setup	Author-supplied value	Author-supplied value
Support	Author-supplied value	Author-supplied value
Pricing model	Author-supplied value	Author-supplied value

Us vs them comparison

Features

From first call to opening night
Walk the space
We visit, measure the light and listen to how the room is used.
Sketch the plan
Two layouts and a material board within a week.
Build and style
Our crew installs, styles and photographs every corner.
Open the doors
A walkthrough with your team before the first guests arrive.
Horizontal steps
Process
How it works
Connect
Describe the first step.
Configure
Describe the second step.
Launch
Describe the third step.
Numbered step cards
Process
How it works
Start
Explain the first step.
Step timeline
Process
Used by teams at
Example Co
Sample Labs
Placeholder Inc
Demo Works
Fixture Studio
Logo row (text chips)
Social proof
Names from the last season
Each name is text the author wrote. These are not logos and not endorsements.
Harbor
Fieldnote
Kindling
Lumen
Marrow
Orchard
Logo wall
Social proof
Proof note
Social proof
Single testimonial quote
Social proof
At a glance
12
Example figure
Replace with a number you can stand behind
3 min
Another figure
99%
Third figure
Illustrative
User-supplied values
Stats band
Social proof
The team
Placeholder people for layout review; replace with your own names and roles.
First Person
Founder
One line about this person.
Second Person
Design
Third Person
Engineering
One line about this person.
Team grid
Social proof
Kind words (fictional examples)
Maya Okafor
Owner, Harbour Bistro (fictional)
They understood the room before we did. Guests ask about the lights every night.
Tom Reyes
Founder, Corner Bar (fictional)
Calm, quick and exact. Six weeks from first call to opening.
Ines Duarte
Potter (fictional)
The studio finally feels like the work we make in it.
Testimonial grid
Social proof
What people say
Placeholder quotation one, written by the author for layout review.
A. ExampleRole, Example Co
Placeholder quotation two, a little longer so the wall shows uneven card heights as real quotes would.
B. Example
Placeholder quotation three.
C. ExampleRole
Testimonial wall
Social proof
Trust notes
Policy statementAuthor-written detail
Guarantee statement
Compliance statementReplace with your own
Text trust badges
Social proof
In practice
Workspace
Detail
Team
Gallery grid
Galleries
Recent rooms
Harbour bistro
Corner bar
Ceramics studio
Lakeside lodge
Masonry gallery
Galleries
Project in focus
The Saltworks, MargateA 1920s warehouse turned into a forty-cover restaurant.
Tiles from a local kiln
Reclaimed oak throughout
Lighting by night
Showcase gallery
Galleries

Compare plans

Plan comparison; prices are user-supplied labels
Feature	StarterFree	TeamYour price	EnterpriseContact us
Seats	1	Up to 10	Unlimited
Projects	3	Unlimited	Unlimited
Support	Community	Email	Dedicated
Exports	HTML	HTML + JSON	HTML + JSON + API
	Choose Starter	Choose Team	Talk to us

Pricing comparison table

Pricing

One package, everything included
Room refresh
From $4,800
Design, sourcing and styling for one room, delivered in six weeks.
Site visit and measured plan
Two layout options
Material and lighting board
Installation and styling
Photography of the finished room
Book a site visit
Fictional studio and price, for illustration.
Pricing spotlight
Pricing
Illustrative pricing
Example plan
Example: $20/month (illustrative)
Not an actual vendor offer.
Learn more
Simple pricing
Pricing
FAQ accordion
FAQ
Questions
Is this real copy?
No. Every sentence here is placeholder text written for this repository.
Where do the images come from?
Nowhere. Media slots carry alt text only and render a labelled placeholder.
Can I change the colours?
Yes. Tokens restyle every block in place.
What about the numbers?
They are user-supplied strings printed verbatim.
Two-column FAQ
FAQ
Call to action band
Calls to action
Minimal CTA banner
Calls to action
Newsletter signup
Calls to action
Split call to action
Calls to action
Example Studio
Placeholder footer copy. No legal text has been written.
Product
Features
Pricing
Gallery
Company
About
Notes
Help
FAQ
Contact
Column footer
Footers
Example Studio
Privacy
Terms
Contact
Showcase content for internal review.
Minimal centred footer
Footers
Simple footer
Footers
The spring workshop opens Monday.Reserve a seat
Northwind
Work
About
Talk to us
Announcement navigation
Navigation
Northwind
Product
Stories
Pricing
Sign in Start a trial
Centered wordmark navigation
Navigation
Northwind
Menu
Index
Journal
Visit
A small studio for product pages and decks.
Write to the studio
Minimal menu navigation
Navigation
Example Studio
Features
Pricing
FAQ
Start
Simple navigation bar
Navigation
Who to talk to
Mina Ortiz
Studio lead
mina@example.com
Weekday mornings
Closing contact
Title slides
Closing CTA slide
Title slides
Cover slide with image
Title slides
Image with caption
Title slides
Section divider slide
Title slides
Title slide
Title slides
Agenda
Where we are
Current state in one line.
What we learned
Three findings.
What we propose
What we need
Decisions and owners.
Agenda slide
Content slides
Supporting points
First point
User-provided supporting context.
Points slide
Content slides
Problem and solution
Content slides
What happens next
Now
Private beta
A handful of teams on the studio.
Next
Decks and mobile
The two workflows people ask for.
Later
Shared libraries
Teams reuse the blocks they trust.
Roadmap
Content slides
Who is in the room
Avery Chen
Design
Owns the canvas and the type.
Jordan Hale
Engineering
Owns export and the catalog.
Team slide
Content slides
How the year unfolded
Mar
Opened the beta
First customers on the waitlist.
Jun
Shipped decks
Ten-slide exports left the studio.
Sep
Team of twelve
Timeline
Content slides
Two ways to ship
Option A
Stay on the old flow
One review cycle
Manual export
Option B
Move the deck into the studio
The ask
One canvas
HTML and slides
Two options
Content slides
Two-column slide
Content slides
Author-supplied comparison
Option AYour value
Option BYour value
Option CYour value
User-supplied values · bar lengths are the author's own percentages
Horizontal bars slide
Data slides
Author-supplied trend
Q1Your value
Q2Your value
Q3Your value
Q4Your value
User-supplied values · heights are the author's own percentages
Line chart
Data slides
Metric slide
Data slides
The ask
Pilot
Your price
One team, one quarter
Studio access
Weekly review
Rollout
Your price
Shared library
Export
Prices are the author's labels · replace these labels with your own numbers
Pricing ask
Data slides
Quote slide
Quote slides
Empty state
Welcome screens
Welcome
1 of 3
First pane
One sentence about the first idea.
2 of 3
Second pane
One sentence about the second idea.
3 of 3
Third pane
One sentence about the third idea.
Next
Onboarding carousel screen
Welcome screens
Onboarding step
Welcome screens
Welcome screen
Welcome screens
Home
Avery Chen
2h
The deck is ready for review.
Jordan Hale
5h
Checkout copy is in the draft.
Home feed
List screens
Home
Static mock-up: tabs are labels, not navigation.
Card one
Author-written card copy.
Card two
Author-written card copy.
Home
Search
Inbox
Profile
Home screen with tab bar
List screens
Example items
First item
A static prototype item.
List screen
List screens
Activity
Deck ready for review
New2h
Mina left the closing slide in the draft.
Export finished
1d
The HTML file is in the project.
Notifications
List screens
Find a class
Morning yoga
Near me
Today
Beginner
3 classes match (fictional)
Sunrise flow
Lumen Yoga · 7:00 · 45 min
Gentle stretch
Harbour Studio · 8:30 · 60 min
Breath and balance
Lumen Yoga · 9:15 · 30 min
Search results screen
List screens
Settings
Notifications
Email and push
On
Theme
System
Language
Interface language
English
Export data
Download everything as JSON
Settings list screen
List screens
Lumen Yoga
Usually replies in an hour
You:
Hi! Do I need to bring my own mat?
9:41
Lumen Yoga:
Not at all, we have mats and blocks for everyone.
9:44
You:
Perfect, see you Thursday.
9:45
Write a message
Chat thread screen
Detail screens
Detail screen
Detail screens
Booking LY-2041
You are booked in
Thursday, 8:30
Booking confirmed
Just now
Done
Reminder sent
Wednesday evening
Check in at the studio
Thursday 8:20
Message the studio
Order tracking screen
Detail screens
Mina Ortiz
Studio lead
Keeps the deck and the mobile flow in one place.
TeamStudio
FocusDecks
Profile
Detail screens
Email digest
A summary of drafts that are waiting on you.
Current
Weekly
One note each Monday
No extra messages
See activity
Settings detail
Detail screens
Choose a time
Thursday 14 March
7:00
8:30 (selected)
9:15
12:00
17:30
19:00
Fictional studio and times, for illustration.
Continue
Booking screen
Form screens
Order
PilotYour price
Export add-onYour price
Due todayYour total
Total is the author's label, not a sum · these amounts are not added together
Continue
Checkout summary
Form screens
Form screen
Form screens
Unlock every class
One membership for every studio in the app.
Unlimited bookings
Cancel up to two hours before
Guest passes each month
Best value
Yearly
$96 / year
Works out to $8 a month
Monthly
$12 / month
Start membership
Fictional prices. Cancel any time in settings.
Paywall screen
Form screens
Sign-in screen
Form screens