Tailwind CSS + React Templates - Subframe UI
Templates
Home Components Theme Templates Docs Blog
Start for free Log in
Join Slack CommunityGithubTwitterLinkedIn
What will you build next?
Discover beautiful page templates, UI snippets, and components. Fully editable designs. React + Tailwind CSS code export.
Search templates...
Dashboard
Detail View
Home
Landing Page
Onboarding
Settings & Preferences
Add filter
Edit theme
My Apps\
\
Create\
\
Get started\
\
Start from scratchA blank slate for your new app.\
\
Find a templateStart from a pre-built app.\
\
Learn how to buildHow-to guides & more.\
\
5 apps\
\
Filter\
\
Sort\
\
Crumble Bakery Landing PagePublished • 12 active users\
\
Last edited 2 days ago\
\
CloudCanopy's Admin DashboardPublished • 4 active users\
\
Last edited 1 week ago\
\
Freshfare Delivery iOS appArchived\
\
Last edited 3 weeks ago\
\
TrendyTrail Fashion StorefrontNot published\
\
Last edited 1 month ago\
\
Notify Web AppPublished • 2 active users\
\
Last edited 3 months ago\
\
Chat House MobileNot published\
\
Last edited 6 months ago\
\
Home list with cards
A\
\
sweetgreen\
\
Add to list\
\
Run workflow\
\
Compose email\
\
Alex Smith\
\
Alex Smith - about 3 hours ago\
\
Activity\
\
Emails\
\
Team\
\
Notes\
\
Tasks\
\
Files\
\
Activity2025\
\
This week\
\
A\
\
Alex Smith changed 7 attributes in\
\
Sales\
\
3 mins ago\
\
Stage\
\
Meeting\
\
Priority\
\
Medium\
\
Owner\
\
A\
\
Alex Smith\
\
Contract value$50,000.00\
\
Point of Contact\
\
A\
\
sweetgreen\
\
Projected close dateMar 1st 2025\
\
Close confidence\
\
A\
\
sweetgreen was added to\
\
Sales\
\
8 mins ago\
\
A\
\
sweetgreen was createdabout 4 hrs ago\
\
January\
\
A\
\
Alex Smith first contacted sweetgreen2 mo ago\
\
Details\
\
Comments\
\
Profile Details\
\
Domain\
\
sweetgreen.com\
\
Name\
\
sweetgreen\
\
Description\
\
sweetgreen offers simple, seasonal, and healthy salads.\
\
Categories\
\
Retail\
\
Food\
\
B2C\
\
Show all\
\
Lists\
\
Add to list\
\
SalesCreated 3 days ago\
\
Stage\
\
Meeting\
\
Priority\
\
Medium\
\
Owner\
\
A\
\
Alex Smith\
\
Show all\
\
MeetingsUpdated today\
\
With\
\
J\
\
Jennifer Lopez\
\
Location\
\
Conference Room A\
\
Duration\
\
45 minutes\
\
View details\
\
Company profile detail
Home\
\
A\
\
$47,031.80\
\
Crypto\
\
Balance$47,031.80\
\
StakingEarn up to 2.45% APY\
\
Cash\
\
Balance$47,031.80\
\
EarnEarn up to 2.45% APY\
\
For you\
\
\
\
Learn to tradeFees as low as 0.00% for a limited time\
\
\
\
Earn rewardsStake your crypto assets to earn\
\
Prices\
\
Watchlist\
\
B\
\
EthereumETH\
\
$3,456.78\
\
2.34%\
\
Buy\
\
D\
\
DogecoinDOGE\
\
$0.22\
\
1.45%\
\
Buy\
\
S\
\
SolanaSOL\
\
$180.45\
\
+3.21%\
\
Buy\
\
Market Overview\
\
24h\
\
Trading Volume$24.8B\
\
12.4%\
\
Active Traders234.5K\
\
5.2%\
\
Market SentimentBullish\
\
Market News\
\
All Categories\
\
Bitcoin Reaches New ATHBitcoin surpasses previous records amid institutional adoption\
\
5m ago\
\
ETH 2.0 UpdateEthereum network prepares for major protocol upgrade\
\
15m ago\
\
Buy\
\
Sell\
\
Convert\
\
One-time order\
\
0USD\
\
Max\
\
0 BTC\
\
Pay withUSD Wallet\
\
BuyBitcoin\
\
Market orderYou're placing a market order which will execute immediately.\
\
Preview buy\
\
Send crypto\
\
Receive crypto\
\
Deposit cash\
\
Withdraw cash\
\
Crypto dashboard
Trending Topics\
\
A\
\
FEATUREDThe Rise of AI in Crypto Trading\
\
Explore how artificial intelligence is revolutionizing cryptocurrency trading strategies and market analysis.\
\
A\
\
NEWDeFi 2.0: The Next Wave\
\
Discover the latest innovations in decentralized finance and how they're reshaping the future of financial systems.\
\
Top Performers This Week\
\
All Networks\
\
7D\
\
| # | Token | Price | Percent Change | Market Cap | Volume |\
| --- | --- | --- | --- | --- | --- |\
| 1 | BitcoinBTC | $43,275.68 | 5.23% | $845.2B | $28.4B |\
| 2 | EthereumETH | $2,475.94 | 3.82% | $298.5B | $12.7B |\
| 3 | CardanoADA | $0.578 | 7.61% | $20.3B | $742.1M |\
| 4 | PolkadotDOT | $7.92 | 9.34% | $9.8B | $385.6M |\
| 5 | ChainlinkLINK | $15.50 | 5.42% | $107.5M | $37.9 |\
| 6 | GROKGROK | $0.014 | 8.1% | $45.1M | $9.0M |\
| 7 | SubframeSUB | $4.21 | 5.87% | $12.1M | $3.3M |\
\
1\
\
2\
\
3\
\
4\
\
5\
\
Home with cards and table
Sales ReportOverview of your store's performance and customer engagement\
\
Download\
\
Share\
\
Overview\
\
Products\
\
Customers\
\
Total Revenue$24,892\
\
Just now\
\
Orders842\
\
1 hour ago\
\
Conversion Rate3.2%\
\
Just now\
\
Sales Trends\
\
Past month\
\
JanFebMarAprMayJun06500130001950026000\
\
Total Revenue\
\
Orders\
\
Conversion Rate\
\
Top Customers\
\
Sort by\
\
| Customer | Orders | Total Spent | Last Purchase | |\
| --- | --- | --- | --- | --- |\
| A
John Doe | 15 | $1,250.25 | 2 days ago | |\
| A
Alice Smith | 12 | $980.36 | 1 week ago | |\
| A
Robert Johnson | 10 | $875.50 | 3 days ago | |\
| A
Emma Wilson | 10 | $750.25 | 5 days ago | |\
| A
Michael Brown | 7 | $620.75 | 1 day ago | |\
\
Reporting dashboard
Insights\
\
Open site\
\
Total Visitors3,944\
\
Total Page Views5,620\
\
Snce Jun 1\
\
Who Viewed Your Page\
\
73\
\
12%\
\
Jul 16 – Aug 15\
\
| Visitor | Date | Time Spent | |\
| --- | --- | --- | --- |\
| S
Steve JobsCEO, Apple | Aug 12, 2024 | 17 min | |\
| M
Marissa MayerCo-founder, Sunshine | Aug 10, 2024 | 8 min | |\
| S
Satya NadellaCEO, Microsoft | Aug 7, 2024 | 12 min | |\
\
1 of 5\
\
Unique Visitors\
\
2,731\
\
23%\
\
Page Views\
\
7,198\
\
31%\
\
Jul 16 – Aug 15\
\
Jul 16Jul 23Jul 30Aug 6Aug 13Aug 20Aug 27Sep 30200400600800\
\
Unique Visitors\
\
Page Views\
\
Top Pages\
\
Jul 16 – Aug 15\
\
Home\
\
2,826\
\
News\
\
1,603\
\
Profile\
\
899\
\
Settings\
\
830\
\
Help\
\
208\
\
1 of 3\
\
Insights dashboard
\
\
Product\
\
Features\
\
Pricing\
\
About\
\
Changelog\
\
Contact\
\
Log in\
\
Sign up\
\
\
\
Log in\
\
Sign up\
\
The AI EcosystemPricingExperience the power of AI with your entire team, free of charge. Upgrade to unlock unlimited cutting-edge AI features.\
\
Starter\
\
$0\
\
Essential intelligence for everyone\
\
Smart task prioritization\
\
2 automated workflows\
\
250 predictive analysis credits\
\
Get started\
\
Pro\
\
$8 per user/month\
\
-20%\
\
Billed yearly\
\
All Starter features\
\
5 automated workflows\
\
Unlimited analysis\
\
Predictive resource allocation\
\
Upgrade to Pro\
\
Business\
\
$12 per user/month\
\
-20%\
\
Billed yearly\
\
All Pro features\
\
Unlimited automated workflows\
\
Unlimited analysis\
\
Access management\
\
Analytics dashboard\
\
Smart ecosystem integrations\
\
Upgrade to Business\
\
EnterpriseCustom solutions\
\
Annual billing only\
\
All Business features\
\
Smart scaling\
\
Adaptive security\
\
Onboarding assistance\
\
Intelligent authentication\
\
Request trial\
\
Included\
\
Intelligent agents\
\
Data capacity\
\
Smart workflows\
\
Advanced Features\
\
Ecosystem apps\
\
Data migration\
\
Predictive insights\
\
Access control\
\
Intelligent authentication\
\
Free\
\
Get started\
\
1 agent\
\
500MB/day\
\
2\
\
Basic\
\
Get started\
\
10 agents\
\
Unlimited\
\
5\
\
Business\
\
Get started\
\
Unlimited\
\
Unlimited\
\
Unlimited\
\
Enterprise\
\
Get started\
\
Unlimited\
\
Unlimited\
\
Unlimited\
\
Subframe\
\
ProductFeaturesIntegrationsPricingDocsDownload\
\
CompanyAbout usBlogCareersCustomers\
\
ResourcesCommunityContactPrivacy PolicyTerms of Service\
\
DevelopersAPIStatusGithub\
\
Modern pricing page](/content/templates/t/modern-pricing-page/index.html)
\
\
Product\
\
Features\
\
Pricing\
\
About\
\
Changelog\
\
Contact\
\
Log in\
\
Sign up\
\
\
\
Log in\
\
Sign up\
\
\
\
INTELLIGENT FEATURESRevolutionizing development with AI-driven innovationOur platform harnesses cutting-edge machine learning to deliver unparalleled speed, adaptive workflows, and predictive insights. By amplifying your team's capabilities, we empower high-performance organizations to build groundbreaking products.\
\
Build more intelligentlyOur AI-powered platform breaks down barriers in software development. With its intelligent yet intuitive design, it enhances decision-making, accelerates execution, and optimizes planning. We've embedded cutting-edge AI practices directly into the product, so you can focus on innovation without worrying about best practices.\
\
\
\
Code PatternsAI models detect patterns to predict potential bugs\
\
\
\
Predictive ResourcesML models forecast optimal loads and durations\
\
\
\
Allocation AIPredictive models optimize team and resource distribution\
\
\
\
Market TrendsAI analyzes market data to guide product strategy\
\
\
\
Dynamic AgentsML models predict optimal team compositions\
\
\
\
Priority EngineAI predicts high-impact tasks for optimal prioritization\
\
Develop next-gen modelsOur platform integrates state-of-the-art Large Language Models, pushing the boundaries of what's possible in software development. These advanced LLMs understand context, generate human-like code, and provide intelligent assistance throughout the development lifecycle.\
\
\
\
Contextual Code SynthesisLLMs generate and refactor code based on project context\
\
\
\
Project OrchestrationLLMs analyze project specs, team capacity, and historical data\
\
\
\
Natural CollaborationLLMs facilitate seamless communication between teams\
\
AI today \
Future tomorrow\
\
Start with AI\
\
Schedule demo\
\
Subframe\
\
ProductFeaturesIntegrationsPricingDocsDownload\
\
CompanyAbout usBlogCareersCustomers\
\
ResourcesCommunityContactPrivacy PolicyTerms of Service\
\
DevelopersAPIStatusGithub\
\
Modern feature page](/content/templates/t/modern-feature-page/index.html)
Where toSearch destinations\
\
Check inAdd dates\
\
Check outAdd dates\
\
WhoAdd guests\
\
Amazing views\
\
Real castles\
\
Creative spaces\
\
Pet friendly\
\
House boats\
\
Filters\
\
Display total before taxes\
\
Guest favorite\
\
\
\
Los Gatos, California\
\
4.85\
\
Mountain and lake viewsFeb 14 – Feb 21\
\
$260night\
\
Guest favorite\
\
\
\
San Francisco, California\
\
4.85\
\
Downtown experienceFeb 14 – Feb 21\
\
$480night\
\
Guest favorite\
\
\
\
Palo Alto, California\
\
4.85\
\
Farm to table cousineFeb 14 – Feb 21\
\
$330night\
\
Guest favorite\
\
\
\
Calistoga, California\
\
4.85\
\
Vineyards and rolling hillsFeb 14 – Feb 21\
\
$400night\
\
Guest favorite\
\
\
\
San Francisco, California\
\
4.85\
\
Urban parks and city viewsFeb 14 – Feb 21\
\
$200night\
\
Guest favorite\
\
\
\
Yosemite, California\
\
4.85\
\
Mountain and lake viewsFeb 14 – Feb 21\
\
$285night\
\
Guest favorite\
\
\
\
Columbia Falls, Montana\
\
4.85\
\
Mountain viewsFeb 14 – Feb 21\
\
$320night\
\
Guest favorite\
\
\
\
Zion, Utah\
\
4.85\
\
Mountain and lake viewsFeb 14 – Feb 21\
\
$240night\
\
Continue exploring\
\
Show more\
\
Marketplace listings home
Inbound Leads\
\
Active\
\
Import\
\
Share\
\
Filter\
\
Sort\
\
Group by\
\
Customize\
\
Download\
\
New\
\
A\
\
Carter LexingtonSkyward Tech Solutions\
\
Apr 4\
\
$50,000\
\
A\
\
Natalie VaughnEcho Dynamics\
\
Apr 3\
\
$10,000\
\
A\
\
Jackson PearceLuminous Analytics\
\
Mar 23\
\
$15,000\
\
Qualified\
\
A\
\
Marcus ReynoldsQuantum Innovations\
\
May 12\
\
$75,000\
\
A\
\
Elena RodriguezNexus Technologies\
\
May 9\
\
$45,000\
\
A\
\
Tyler HarrisonZenith Enterprises\
\
May 5\
\
$30,000\
\
Meeting\
\
A\
\
Ethan KingsleyFrontier Dynamics\
\
Jun 15\
\
$90,000\
\
A\
\
Sophia RamirezHorizon Innovations\
\
Jun 10\
\
$65,000\
\
Kanban card board
Home chat screen
List detail page with tree
Dashboard with text filters and table list
Project tracker
Marketplace listing detail
A\
\
A\
\
A\
\
Subframe\
\
Assistant\
\
Inbox\
\
1\
\
Drafts\
\
Saved\
\
Direct messages\
\
2\
\
Favorites\
\
design\
\
2\
\
front-end\
\
4\
\
Channels\
\
general\
\
1\
\
inspo\
\
engineering\
\
12\
\
gtm\
\
2\
\
Favoritesdesign\
\
JD\
\
Alex Chan9:03 AM\
\
Morning team! 👋 I've just pushed the latest mockups for the dashboard redesign to our Subframe project. @Sarah could you take a look at the color scheme? I'm not sure if it aligns with our new brand guidelines.\
\
\
\
Dashboard Redesignapp.subframe.com\
\
🔥 2\
\
👀\
\
JD\
\
Diana T.2d ago\
\
Good morning, Alex! Sure thing, I'll review the color palette right away. 👀\
\
🙌\
\
JD\
\
Daniel A.2d ago\
\
@Alex, quick question - did you consider the mobile view for those new data visualization components? I'm a bit concerned about how they'll render on smaller screens.\
\
\
\
JD\
\
Alex Chan9:03 AM\
\
Good point! I focused mainly on the desktop version. Could you take a stab at adapting those for mobile? Your expertise in responsive design would be really helpful here.\
\
Chat channel thread
For you\
\
Sales Assistant\
\
Demo\
\
Browse assistants\
\
Invite\
\
Help\
\
Demo meeting\
\
Summarize this meeting\
\
\
\
Sana AI Daily StandupNov 26, 4:28 pm\
\
Demo fileWhat is the architecture of Mixtral 8x7B and how does it differ from Mistral 7B?\
\
Mixtral of Experts\
\
Demo task\
\
Conduct a competitor analysis\
\
Demo task\
\
Prepare a BANCT analysis for a sales meeting\
\
Recent\
\
MobiNotes R1 Testing Results\
\
MobiNotes_R1TestingResults.csv\
\
MobiNotes Competitors\
\
Global Hiring Restrictions at Zapier\
\
Copy of Improving SplitBill Observations\
\
Improving SplitBill Observations - Partici...\
\
Improving SplitBill Observations.csv\
\
UX Researcher Job\
\
Sam Lee Community Members\
\
View all\
\
Home chat with cards view
AI chat
AI search results
Dashboard with table
Stock dashboard with news
Cards with large image, title, and description
Dashboard with tiles
Modern home page
Modern about page
Meeting agenda schedule
Home dashboard with cards
Detail view drawer with activity
Confirm payment card
Dashboard with analytics
Home with hero list
PrivacyTailor who sees what with, putting you in charge of your online space.\
\
PersonalizationCustomize fonts, themes, and more, making every interaction yours.\
\
NotificationsTweak when and how you receive updates for a seamless experience.\
\
Simple cards with a large icon, title, and description
\
\
DeepSea\
\
Floor1.05 ETH\
\
Volume420 ETH\
\
\
\
Silkscreen 2.0\
\
Floor0.12 ETH\
\
Volume63 ETH\
\
\
\
Helix\
\
Floor0.41 ETH\
\
Volume142 ETH\
\
Cards with image, title, and stats](/content/templates/t/cards-with-image-title-and-stats/index.html)
Hello Jane!\
\
Mon, July 1\
\
Events\
\
Birthdays\
\
Holidays\
\
11:00 AM11:15 AM\
\
MeetingCall with Deny\
\
12:00 PM1:00 PM\
\
MeetingLunch\
\
2:30 PM3:00 PM\
\
Video CallQ4 Review & Planning\
\
1 invite pending\
\
A\
\
To-dos\
\
Revew time-off requestDiana Ford requested 2 days of leave\
\
6h\
\
Submit Q3 budget12 days remaining\
\
1d\
\
Schedule Product Designer interviewAlbert Moss moved to the Interview stage\
\
1d\
\
Open Jobs\
\
New job\
\
Product DesignerRemote\
\
Published\
\
12 applicants\
\
Head of MarketingRemote\
\
Published\
\
4 applicants\
\
CTOSan Francisco, CA\
\
Draft\
\
0 applicants\
\
View all jobs\
\
Home dashboard with tile grid
Bold feature page
Chat message input with formatting toolbar
Workflow shortcuts builder
Product detail page with sections
Product Hunt post detail
Social profile
Onboarding integration cards
Inbox
ChatGPT message bar footer
Detail profile page with activity
GPT AI playground
Wizard card with multiselect progress
Calendar event card module
Sign up with quote
Card with daily meeting events
Detail card with item fields
Checkout card detail breakdown
Portfolio dashboard
Stock earnings detail cards
ChatGPT new chat
Discover search results with filter sidebar
Dashboard cards with stats
Sign up card with value props
Bold home page
Callout card with icon
Search engine results
Onboarding checklist
Compact cards with large title, user avatar, and metadata
Store product detail
Philz Coffee• Location\
\
\
\
Philz CoffeeCustom-blended java in a casual setting.20686 Stevens Creek Blvd\
Cupertino, CA 95014\
\
Get directions\
\
See details\
\
Find more cafes nearby\
\
More actions\
\
Location card module
21\
\
Upgrade\
\
\
\
Available\
\
Filip Skrzesinski\
\
Get in touch\
\
RATE\
\
$100 – $150/hr\
\
SKILLS AND TOOLS\
\
Web Designer\
\
Brand Designer\
\
Product Designer\
\
Subframe\
\
Figma\
\
React\
\
BADGES\
\
Payments Active\
\
Identity Verified\
\
ABOUT\
\
Co-founder at Subframe. Designer & advisor helping start-ups and scale-ups bring their best ideas to life.\
\
San Francisco, CA\
\
(GMT+8) Pacific Standard Time\
\
English\
\
LINKS\
\
Design that moves the needle 🚀\
\
Work\
\
Services\
\
Recommendations\
\
Add a projectYour projects should highlight your best skills and experience.\
\
Import content in seconds\
\
\
\
Subframe UI RevampElevate your design process with Subframe's cutting-edge tools that boost productivity and unleash creativity. Kickstart your next project with customizable templates that capture your brand's essence. Revolutionize your design journey.\
\
UI Architect\
\
Web Designer\
\
UX Specialist\
\
\
\
SaaS Platform RedesignTransform your digital product with intuitive design elements. Utilize our rich library of themes to give new life to your user interface. Experience a streamlined UI creation process.\
\
Visual Developer\
\
Product Artist\
\
UI Innovator\
\
\
\
Mobile App PrototypeEmpower your mobile app with stunning visuals crafted from real components. Personalize templates to match your distinct brand style, enhancing your design workflow.\
\
App Stylist\
\
Mobile UX Expert\
\
Design Strategist\
\
Profile page with sidebar and project list
ID-420Database transaction error rate is too high\
\
Status\
\
In Review\
\
Priority\
\
High\
\
Duration3hr 19min\
\
Assigned to\
\
JS\
\
Emily Jones\
\
Escalate\
\
Resolve\
\
Activity\
\
Emily Jonesmarked as resolved\
\
1 minute ago\
\
The source of the incident was found and a fix has been pushed up\
\
John Smithescalated this task\
\
1 minute ago\
\
JD\
\
Emily Jonescommented\
\
21 hours ago\
\
Taking a look now!\
\
Reply\
\
John Smithassigned this task to Emily Jones\
\
3 days ago\
\
John Smithcreated this task\
\
3 days ago\
\
Analysis\
\
DescriptionThe error rate indicates that there are issues with the database transactions, which could impact data integrity.\
\
ImpactThe high error rate in the database transaction could result in performance degradation and data inconsistency.\
\
InvestigationThe team will also analyze the database configuration and settings to ensure that they are optimized for performance.\
\
Details page with activity feed
\
\
01PROIN FINIBUS ODIO\
\
Etiam euismod elit id nisl lacinia commodo. Donec non neque quis mauris malesuada ultricies. Sed posuere sem velit, nec vestibulum enim laoreet a. Duis imperdiet egestas pulvinar, In gravida turpis arcu, et semper nisl pellentesque est.\
\
Read more\
\
764—39/23\
Doc—45456\
\
\
\
02VESTIBULUM ULTRICE\
\
Etiam euismod elit id nisl lacinia commodo. Donec non neque quis mauris malesuada ultricies. Sed posuere sem velit, nec vestibulum enim laoreet a. Duis imperdiet egestas pulvinar, In gravida turpis arcu, et semper nisl pellentesque est.\
\
Read more\
\
764—39/23\
Doc—45456\
\
\
\
03ETIAM EUISMO\
\
Etiam euismod elit id nisl lacinia commodo. Donec non neque quis mauris malesuada ultricies. Sed posuere sem velit, nec vestibulum enim laoreet a. Duis imperdiet egestas pulvinar, In gravida turpis arcu, et semper nisl pellentesque est.\
\
Read more\
\
764—39/23\
Doc—45456\
\
LOREM IPSUM\
\
504/GWT\
\
Etiam euismod elit id nisl lacinia commodo. Donec non neque quis mauris malesuada ultricies. Sed posuere sem velit, nec vestibulum enim laoreet a. Duis imperdiet egestas pulvinar, In gravida turpis arcu, et semper nisl pellentesque est.\
\
EmailInstagram\
\
Minimal project portfolio](/content/templates/t/minimal-project-portfolio/index.html)
Large card with user header, title, side by side image and stat list, alert, and action footer
Detail view with ratings
Social news feed
Bold about page
Collection list page with cards
Sign up with social proof
Profile detail sidebar
Chat conversation with detail sidebar
Interactive select screen
Collection grid with slideout detail view
Bold pricing page
Settings\
\
Personal\
\
Account\
\
API Keys\
\
Notifications\
\
Workspace\
\
Billing\
\
Integrations\
\
Team Members\
\
AccountUpdate your profile and personal details here\
\
Profile\
\
Avatar\
\
\
\
UploadFor best results, upload an image 512x512 or larger.\
\
First name\
\
Last name\
\
Email\
\
Password\
\
Current password\
\
New password\
\
Your password must have at least 8 characters, include one uppercase letter, and one number.\
\
Change password\
\
Danger zone\
\
Delete accountPermanently remove your account. This action is not reversible.\
\
Delete account\
\
Account settings
Wizard step with detail panel
Onboarding tutorial
Detail view with stats
Stats cards with icon
Social post thread
Alarm card module
AI chat home
Search input floating with toolbar
Detail card with large image
Home dashboard grid sections
Pricing cards page
Onboarding profile split setup
Profile page
Home grid table with hero
Comments thread with input bar
Large header with image and details
Cards with a user header, large image, and description with title and caption
Minimal blog list
Accordion card with table and filter chips
Cards with toggle switch, title, subtitle, and description
Plan subscription selection cards
Video player with chat transcript
Detail view drawer with fields and tables
Full page editor
Email card module
Calendar detail timeline
Detail page view with fields and tables
Feedback cards with forms
Preferences drawer with controls
Accordion list items
Store reviews dialog
Searchable selection view
Detail info dialog
Checkout order card
Table with people and sort
Large feature card with logos dark
Settings card with toggle switches
Quick start cards with color icons
Tree folder sidebar with search
Accordion cards with radio cards
Product detail add to cart
Integrations table with cards
Accordion card with stats
Slider preferences controls
Kanban column
Create form with file upload
Settings properties with accordions
Integrations settings
| Asset Name | Launch Date | Impressions | Clicks | Conversions | CTR (%) | ROI (%) |\
| --- | --- | --- | --- | --- | --- | --- |\
|
Summer Sale AdInstagram | 06/15/2023Active | 1,200,000 | 85,000 | 1,500 | 7.08 | 320 | |\
|
Winter CampaignFacebook | 12/01/2022Concluded | 950,000 | 60,000 | 2,000 | 6.32 | 400 | |\
|
Back to SchoolGoogle Ads | 08/10/2023Active | 750,000 | 45,000 | 700 | 6.00 | 290 | |\
| Total | | 2,900,000 | 190,000 | 4,200 | 6.47 | | |\
\
Table with thumbnails and total rows
Add a projectYour projects should highlight your best skills and experience.\
\
Import content in seconds\
\
Simple horizontal card well with icon and link button
\
\
SuggestedYosemite National Park\
\
Majestic granite cliffs, iconic waterfalls, and diverse ecosystems converge in Yosemite, a UNESCO World Heritage site.\
\
Waterfalls\
\
Granite\
\
\
\
SuggestedDenali National Park\
\
Home to North America's tallest peak, Denali National Park in Alaska showcases vast wilderness, stunning wildlife, and pristine landscapes.\
\
Tundra\
\
Wildlife\
\
\
\
SuggestedZion National Park\
\
Striking red rock formations, towering sandstone cliffs, and a dramatic canyon define Zion, creating a haven for hikers and nature enthusiasts. \
\
Canyons\
\
River\
\
Cards with image, tagline, title, description, and badges](/content/templates/t/cards-with-image-tagline-title-description-and-badges/index.html)
All\
\
Scheduled\
\
Paid\
\
By due date\
\
A\
\
Acme Hunting Supplies\
\
Paid\
\
DueFeb 23, 2023\
\
$99.30\
\
P\
\
Pluto Labs\
\
Paid\
\
DueFeb 28, 2023\
\
$10.99\
\
T\
\
Truewind\
\
Paid\
\
DueMarch 4, 2023\
\
$17.99\
\
E\
\
Extend\
\
Paid\
\
DueApril 1, 2023\
\
$79.40\
\
P\
\
Pluto Labs\
\
Paid\
\
DueFeb 28, 2023\
\
$10.99\
\
E\
\
Extend\
\
Paid\
\
DueFeb 23, 2023\
\
$99.30\
\
L\
\
Lightski\
\
Paid\
\
DueFeb 23, 2023\
\
$34.20\
\
1 of 3\
\
List with tabs and pagination
| Title | Artist | Date added |\
| --- | --- | --- |\
| 1
A
adore uadore u | Fred Again... | 1 hour ago | |\
| 2
A
Teenage BirdsongSixteen Oceans | Four Tet | 1 day ago | |\
| 3
A
CurlsRibbons | Bibio | 1 day ago | |\
| 4
A
Say ThatAnything in Return | Toro y Moi | 3 days ago | |\
| 6
A
We Don't Wanna TalkNowhere | Friday Pilots Club | 5 days ago | |\
| 7
A
Time (You and I)Mordechai | Khruangbin | 1 week ago | |\
| 8
A
AwakeAwake | Tycho | 2 weeks ago | |\
\
Simple ordered table
\
\
WelcomeLogin or sign up below\
\
Continue with GoogleContinue with Apple\
\
Continue with email\
\
Minimal sign in page](/content/templates/t/minimal-sign-in-page/index.html)
Settings\
\
Personal\
\
Account\
\
API Keys\
\
Notifications\
\
Workspace\
\
Billing\
\
Integrations\
\
Team Members\
\
BillingSee your usage and manage your payment methods, subscription.\
\
Usage\
\
Seats\
\
5 out of 20 seats used\
\
Upgrade\
\
Events booked\
\
100 / 100\
\
Meetings scheduled\
\
42 / 50\
\
Calendar connections38 / 100\
\
Payment\
\
Add\
\
\
\
Mastercard ••••0213\
\
Default\
\
Expires 09/26\
\
\
\
Visa ••••9483\
\
Default\
\
Expires 11/25\
\
Subscription\
\
You have 21 days left in your Basic plan trial.To avoid any disruptions to your current workflow, upgrade your plan below.\
\
Start dateMarch 22, 2023\
\
Next paymentOct 22, 2023\
\
BilledMonthly\
\
Free\
\
$0per month\
\
The basics to get you started. Free forever.\
\
5 team members\
\
20 event bookings\
\
10 meetings scheduled\
\
Event notifications\
\
Downgrade\
\
Professional\
\
$29per month\
\
For small teams with calendar needs.\
\
20 team members\
\
100 event bookings\
\
50 meetings scheduled\
\
Premium support\
\
Current plan\
\
Enterprise\
\
Contact us\
\
For larger teams or custom plans.\
\
SSO & user provisioning\
\
SOC2 compliance\
\
24/7 support\
\
Contact us\
\
Billing settings
Tags\
\
#design\
\
#alumni\
\
Add\
\
Section with badge tags
Your detailsfilip@subframe.com\
\
Delivery\
\
United States\
+ Add apartment, suite, etc.\
\
State\
\
Shipping method\
\
Select a different shipping address to view available shipping methods\
\
PaymentAll transactions are secure and encrypted.\
\
Use shipping address as billing address\
\
Sign me up for news and offers from this store\
\
Pay now\
\
\
\
Light Roast Coffee$18.00\
\
Apply\
\
Subtotal$18.00\
\
ShippingEnter shipping address\
\
Total\
\
USD$18.00\
\
You're earning 1% cash back on this purchase by using Subframe Wallet\
\
Store checkout
Minimal about portfolio card
Grid section row of image cards
Home dashboard setup
Simple pricing plan cards
File source workflow dialog
Large list row with badges
Social profile header with badge and actions
File upload dropzone card with file list
Activity feed with comments
Usage progress cards
Profile header with large hero banner
Team members settings
List items with image in a card
History table with stats
Setup step form
Multi step select flow
Simple start page
Crypto onboarding dashboard
Templates dialog
Header with large avatar and score
Sign up form with OAuth and email
Table with ordered rows
Accordion card
Onboarding setup wizard
List with checklist and actions
Header with search and filter toolbar
Progress card with detail amount
Card with color border
Configuration form with help text
List with large thumbnails_ description_ and badges
Vertical stat card with large amount
Card row with feature sections
Large section with cards
Storefront detail
Onboarding step with progress
Filter toolbar with view control
Card with activity items
Document checklist history
Hero header with CTAs and right image
Empty state
Header with breadcrumbs and icons
Post with author and voting
Pie chart section with stats
Settings horizontal rows with editable sections
Store shopping cart
Table with checkboxes and progress
Stats card section row
List table grid with sections
Filter controls in sidebar
Large hero header with avatars_ description_ and CTA
Cards with image, title, inline actions, description, and large button
Table with date filters and detailed rows
Table list two line items
Simple card list with large icons
Explore home page
Document viewer with details
App gallery module
List of key value stats
Simple 404 page
Detail card with balance and large actions
Detail card with icon
Messenger chat inbox
Large cards with floating image
Wallet transfer form
Testimonial quote banner
Simple sign in card
Filter preferences with sections
Order confirmation section
Cards with avatar, title, description, and inline actions
Visual collection grid view
Detailed header with description tags
Card for transaction conversions
Workflow wizard with preview
List sections and two line rows
Stats row with colorful cards
Card with numbered steps and input
Card with numbered checklist and form
Header with large title and filter buttons
Card section with detailed list items
Activity timeline card
Card with image, title, description, and caption
Notification settings
Reviews grid section
Wizard selection view
Grid list with icons
Card with feature highlights
Profile detail with cards
Meeting drawer with switches
Preferences configuration for chat
Minimal project gallery
Chat with project details
Blog Home
Home list with sections
Accordion card with text description
Filters dialog
Stats grid with details
Header with large icon and name field
Compact preview cards with links
Image gallery tiles
Callout card with avatars
Simple large header with center image
Compact header with search and select
List section with large icons
Header with large image and stat
Media player toolbar
Code block with formatting toolbar
List with 2 line items and icon button
Header with center icon
Card with image grid
Profile details card with large avatar and fields
Promo callout card
Simple reset form
Meeting row card
Checkout payment card
Dashboard with card sections and analytics
Product card row
Filters bar with checkbox chips
Horizontal field card
Horizontal card with badges
Onboarding steps modal
Two column text section
List cards with status or action
Notifications checkbox grid
Chart cards with toggle controls
Header with large center image and search
Detailed header with actions and metadata
Billing with usage stats
Large list section with columns and header
Toolbar with search and actions
Detail card with title
List item with large image
Checklist items with active card
Custom code drawer
Payments list
Transaction list with text items
Info list with icons
Header with large hero image
Page header with search and right items
Account profile settings
Info details with icons
Simple confirmation page
Card list with single line items and icons
App icon grid
Table with text items and pagination
Callout cards carousel
Large card with progress and detail cards
Stat row card
Vertical steps with progress
Billing settings overview
Badge suggestion
Card with large icon and CTA
Document preview card with pagination
Large centered header with search
Get started section with empty state
Search result with rich details
Slider row with labels
Simple create flow dialog
Header with details and actions
Detail drawer with list
Simple 2FA authentication
Code verification step
Callout card with badges
Large header with detail fields
Cards with avatar, title, subtitle, primary button, and dismiss icon
Simple card with header and list
Header with status detail
API key settings
Simple icon list with header
Browse collection view list
Header with large bold text
Search result link
List with icons
Progress row with label
Modern footer
API key confirmation dialog
Shipping payment form
Account balance list section
Field badge row
Reviews rating section
Payment balance section
Settings toggle row
Cards with list of items with icon, image, title, and subtitle
Stats section marketing
List items with section header
Cards with list of avatars and footer with multiple buttons
Pricing Plan Card
Sidebar with minimal text sections
Topbar with center logo
Callout section card centered marketing
Dot
Social feed cards with user header, large image, toolbar, and comments
Large profile header with tabs
Cards with list of items with action
Large header with breadcrumbs and tabs
Large cards with inset image, title, emphasized description, and pagination footer
Home List Item
Listing Select
Modern navbar mobile
Large card with image text overlay, title, subtitle, and button
Dropzone on large card
Large cards with inset image, title, inline actions, description, and buttons
Pricing cards with large headers
Dropdown button
Create dialog with two columns
Card section bento grid
List
Card section well marketing
Feature section left marketing
Filter Badge
Chat Received
Form fields with help text
FAQ accordion section marketing
Simple card row with image
AI Chat Toolbar
Task activity card with breadcrumbs
Card section elevated marketing
Dropzone with icon and button
Small image tile gallery
Topbar with left nav
Sidebar with collapsible sections
Listings Search
Sidebar with sections
Filter Chip
Horizontal Divider Form
Detailed card with user header, short content, badges, and footer with actions and metadata
Dropzone with brand dashed border
Cards with right-aligned image avatar. description, and caption
Feature list icon section marketing
Cards with large image, title, description, and actions
Stats with dividers
Cards with large avatar, featured text, title, and description
Stacked cards with large avatar, title, and emphasized description
Topbar with right nav
Settings Menu
Task row with progress
Simple Form
Feature section right marketing
Card section marketing
Large feature card with details
Feature list image section marketing
Cards with user header, action button, description text, and footer with caption
Chat Channels Menu
Horizontal cards with image avatar, title, description, and metadata
Toolbar icon buttons
Simple stats cards
Sidebar with minimal sections
Stats cards with large heading
Text Field Unstyled
Home Card
Feature callout card
List Row
Sidebar Collapsible
Cards with list of avatars and button
Simple horizontal cards with small image, title, and subtitle
Filter bar with header text
Minimal cards with image, title, and metadata
Simple cards with large avatar, title, subtitle, and caption
Page header with metadata
Header with detail fields
Logos section marketing
Image section grid marketing
Progress bar card
Hero banner with floating avatar
Large Badge
Detailed cards with left-aligned image avatar. badges, description, and stats with metadata
Page header with large avatar
Card Form Wizard
Quick action cards
Data Field Horizontal
Feature section with list right marketing
Text cards with title, description, and matedata
Code Block
Pagination with small buttons
Card with step status detail
Section header
Compact header with icon and badge
Callout section centered marketing
Horizontal cards with right-aligned image, title, and metadata
Details vertical list
Gallery cards with image, title, and metadata
Integration card
Stats cards centered
Dropzone with neutral dashed border
Compact pagination
Copy to clipboard field
Profile image upload
Page header with actions
Topbar with search
Pagination with right buttons
Sidebar with nested sections and search
Cards with large title, badge, icon, details, and action
Inbox Item
Settings select row
Header for product detail with image
Gallery cards with image, title, and subtitle
Simple cards with title, description, and button
Search Detail
Chat Header
Topbar with center nav
Simple cards with a large icon, multiline text, and action
Sidebar rail with icons
Hero section top marketing
Compact page header with avatar
Testimonials masonry section marketing
Cards with title, badge, and descriptive list of features
Details horizontal list
Pricing card section marketing
Filter bar with search and date picker
Filter bar with three dropdowns
Chat Channel Message
Feature details with two column icon rows
Button Placeholder
Chip
Hero section right marketing
Simple card well with icon and action
Hero section centered with background image marketing
Stats cards with percent change
Topbar with center search
Chat List
Placeholder content
Sidebar with large items
OAuth Social Button
Modern navbar
Profile cards with avatar, background image, and actions
Payment Method Row
Simple horizontal cards with icon, title, and subtitle
Meeting event row
Image section large marketing
Stats card section centered
Pagination
Bold navbar
Topbar with left nav and right buttons
Search Card
Chat Select Item
Feature section with list left marketing
Form with Content
Testimonial feature review section marketing
Horizontal progress card with pagination
Dropzone with background
Large image cards with text overlay
Contact form section marketing
Large cards with colorful icon, title, description, link, primary button, and caption footer
Dashboard list view
Stats cards with badges
List drawer with search
Chat Select
Topbar with tabs
Sidebar rail with labels
Timeline Divider
Dropzone card
Simple horizontal cards with cropped image and title
Custom Tree View
Simple profile header with icons
Listings Tabs
Hero section centered marketing
Hero section left marketing
Bold footer
Info tooltip
Bold navbar mobile
Horizontal cards with title, subtitle, and icon button
Chat Sent
Filter bar with three filter chips
Chat Transcript
Cards with small image, title, button, and metadata
Accordion
Alert
Area Chart
Avatar
Badge
Bar Chart
Breadcrumbs
Button
Calendar
Checkbox
Checkbox Card
Checkbox Group
Context Menu
Copy to clipboard button
Dialog
Drawer
Dropdown Menu
Fullscreen Dialog
Icon Button
Icon with background
Line Chart
Link Button
Loader
Pie Chart
Progress
Radio Card Group
Radio Group
Select
Skeleton Circle
Skeleton Text
Slider
Stepper
Vertical Stepper
Switch
Table
Tabs
Text Field
Text Area
Toast
Toggle Group
Tooltip
Tree View
CTA Card
Feed
Image Gallery
Stats Card
Date Button
Built in Subframe
LinkedInTwitterGithubInstagramJoin Slack Community
Product Components Theme Templates Docs Pricing
Company Blog LinkedIn X / Twitter Github
Resources Slack community Help center For agencies For design systems Subframe vs Figma Built with Subframe
200