Examples Library
Choose a complete case study to view the result, modify the source, and run it in the browser.
Range adjuster for pantry cart configuration
Complete a range adjuster in a pantry setup cart scenario: includes real content, interactive controls, clear status feedback, and responsive layouts.
Open and runMaintenance Appointment Summary Confirmation Form
Complete a summary confirmation form in a repair booking scenario: include real content, actionable controls, clear state feedback, and a responsive layout across sizes.
Open and runClinic Service Hall Breadcrumb Navigation
Complete breadcrumb navigation in a clinic service hall scenario: includes real content, interactive controls, clear state feedback, and responsive layouts.
Open and runMentor check-in bell toast stack
Complete the message notification stack for the mentor check-in bell scenario: include real content, interactive controls, clear state feedback, and cross-size layouts.
Open and runField Story Shelf Story Carousel Card
Complete a story carousel card in a field story shelf scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runSpare parts inventory combo filter table
Complete a combined filter table in a spare-parts inventory scenario: includes real content, interactive controls, clear status feedback, and responsive layouts.
Open and runField Guide Magazine Editorial Grid
Complete a magazine editorial grid in the Field Atlas scenario: includes real content, actionable controls, clear state feedback, and responsive layouts across sizes.
Open and runPodcast Story Salon FAQ Conversion Area
Complete a Q&A conversion section for a podcast storytelling event scenario: includes real content, actionable controls, clear status feedback, and responsive layouts.
Open and runGreenhouse Service Network Calendar Heatmap Panel
Complete the calendar heatmap panel in the greenhouse service network scenario: includes real content, actionable controls, clear state feedback, and responsive layouts.
Open and runPantry task rack rating scale
Complete a rating scale in a pantry-task shelf scenario: real content, interactive controls, clear state feedback, and responsive layouts across sizes.
Open and runShift Confirmation Card Budget Setup Form
Complete a budget configuration table for a shift confirmation card scenario: includes real content, actionable controls, clear state feedback, and responsive layouts across sizes.
Open and runClinic Visit Card Command Palette
Complete a command palette in a clinic visit pass scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across screen sizes.
Open and runMentor confirmation card status banner
Complete a status banner in a mentor confirmation card scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runField Survey Line Accordion Content List
Complete the collapsible content list in the field inspection route scenario: includes real content, interactive controls, clear status feedback, and responsive layout across sizes.
Open and runVenue booking inline edit table
Create an inline-edit table for a venue booking scenario: includes realistic content, interactive controls, clear state feedback, and responsive layouts across sizes.
Open and runFull-Bleed Field Report Layout
Complete a full-bleed interleaved layout for a field report scenario: includes real content, actionable controls, clear status feedback, and responsive behavior across sizes.
Open and runRepair Plan Feature Tour Page
Complete a feature tour page for the repair plan scenario: includes real content, actionable controls, clear status feedback, and cross-size layout.
Open and runGreenhouse Shift Log Group Retention Panel
Complete a grouped retention panel for a greenhouse shift log scenario: includes real content, interactive controls, clear status feedback, and cross-size layouts.
Open and runOutpatient Pickup Window Quote Builder
Complete a quote builder in a clinic pickup window scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runClass Notes Drop Cap Layout
A drop-cap layout completed for a classroom notes scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runClinic Stage Content Reveal Animation
Complete content reveal animations in outpatient stage scenarios: includes real content, actionable controls, clear state feedback, and cross-size layouts.
Open and runCoral Room Starfield Traverse Effect
Complete the starfield traversal effect in a coral room scene: includes real content, actionable controls, clear status feedback, and responsive layouts.
Open and runPublic Queue Trend Line Chart
Complete a trend line chart for a public queue scenario: includes real content, actionable controls, clear status feedback, and responsive behavior across sizes.
Open and runOutpatient Recorder Network Status Indicator
Complete the network status indicator in the outpatient recorder scenario: include real content, interactive controls, clear state feedback, and cross-size layouts.
Open and run