Examples Library
Choose a complete case study to view the result, modify the source, and run it in the browser.
Reading List Accordion Content List
Complete a collapsible content list for a reading list scenario: includes real content, interactive controls, clear status feedback, and responsive layouts.
Open and runInventory Ledger Column Visibility Control
Complete the column visibility control in an inventory ledger scenario: includes realistic content, interactive controls, clear state feedback, and responsive layouts.
Open and runArchitectural Journal Dashboard Shell
Complete a dashboard shell for an architectural journal scenario: includes real content, interactive controls, clear status feedback, and layouts across sizes.
Open and runTea Brand Word-of-Mouth Story Wall
Complete a testimonial story wall in a tea beverage brand scene: with real content, interactive controls, clear state feedback, and responsive layouts across sizes.
Open and runLibrary Operations Command Center
Complete the operations command center in a library operations scenario: includes real content, actionable controls, clear status feedback, and cross-size layouts.
Open and runFlower shop service reservation flow
Complete a service booking flow in a flower shop scenario: includes real content, actionable controls, clear status feedback, and responsive layout.
Open and runMountain Poetry Collection drop cap layout
Complete a drop-cap layout in a mountain-poetry collection scenario: includes realistic content, actionable controls, clear state feedback, and cross-size layouts.
Open and runFile Upload Skeleton Screen Transition
Skeleton screen transition for file upload scenarios: includes real content, interactive controls, clear state feedback, and responsive layouts.
Open and runDeep Sea Spotlight Stage
Complete a spotlight stage in a deep-sea scenario: includes realistic content, interactive controls, clear state feedback, and responsive layouts across sizes.
Open and runAir Quality Dashboard Graphic
Complete the dashboard chart in an air-quality scenario: includes real content, actionable controls, clear state feedback, and responsive layouts across sizes.
Open and runDevice Lab Clipboard Demo
Complete a clipboard operation demo in the device lab scenario: include real content, interactive controls, clear status feedback, and a cross-size layout.
Open and runFamily Night Focus Timer
Complete a focus timer for a family night scenario: includes realistic content, actionable controls, clear status feedback, and responsive layouts.
Open and runMeeting Room Filter Chips
Complete the filter chip group in a meeting-room scenario: includes real content, interactive controls, clear status feedback, and responsive layouts.
Open and runVolunteer Sign-Up Dynamic Field Group
Complete a dynamic field group in a volunteer signup scenario: includes real content, interactive controls, clear status feedback, and cross-size layouts.
Open and runMuseum Guide Tree Navigation
Build tree navigation for museum guide scenarios: includes real content, interactive controls, clear status feedback, and layouts across sizes.
Open and runDocument Review Keyboard Tooltip
Keyboard tooltip completed in a document review scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runReading List Story Carousel Cards
Complete a story carousel card for a reading-list scenario: includes real content, interactive controls, clear status feedback, and responsive layouts.
Open and runInventory Ledger Sticky Header
Completed a sticky table header for an inventory ledger scenario: includes real content, actionable controls, clear status feedback, and cross-size layouts.
Open and runArchitecture Journal Editorial Grid
Complete the magazine editorial grid in an architecture journal scenario: includes realistic content, actionable controls, clear state feedback, and responsive layouts across sizes.
Open and runTea brand feature tour page
Create a feature tour page in a tea brand scenario: include real content, interactive controls, clear state feedback, and responsive layouts.
Open and runLibrary Operations Resource Usage Dashboard
Complete a resource usage panel in a library operations scenario: includes realistic content, actionable controls, clear status feedback, and responsive layouts.
Open and runFlower Shop Invoice Generator
Complete the invoice generator in a flower-shop scenario: real content, actionable controls, clear state feedback, and responsive layouts across sizes.
Open and runMountain Poetry Collection Text Mask Effect
Complete a text mask effect in a mountain-poem scene: includes real content, interactive controls, clear status feedback, and responsive layouts across sizes.
Open and runFile upload list staggered entry
Complete a staggered list entrance for a file upload scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and run