Examples Library
Choose a complete case study to view the result, modify the source, and run it in the browser.
Activity Signup Timeline
Complete the activity timeline for event signups, with real content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runFleet Maintenance Relationship Matrix
Complete the relationship matrix table in a fleet-maintenance scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runClassic Three-Column Layout for the Classroom Special Issue
Complete the classic three-column layout in a classroom special issue scenario: includes real content, interactive controls, clear status feedback, and responsive layouts across sizes.
Open and runPodcast Club narrative hero
Complete a narrative hero section in the podcast club scenario: includes real content, interactive controls, clear state feedback, and cross-size layouts.
Open and runExhibit Maintenance Operations Command Center
Complete an operations dashboard in an exhibit maintenance scenario: includes real content, actionable controls, clear state feedback, and responsive layouts across sizes.
Open and runMaker Space preference toggle matrix
Complete a preference toggle matrix in a makerspace scenario: include real content, interactive controls, clear state feedback, and a responsive layout across sizes.
Open and runAutomatic draft form for a move-in admission form
Complete the automatic draft form in a residence move-in form scenario: includes real content, interactive controls, clear state feedback, and responsive layouts across sizes.
Open and runOutpatient Dispatch Desk Page Navigation
Complete page navigation in a clinic dispatch desk scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runLab alert contextual action sheet
Complete a contextual action sheet in an lab alert scenario: includes realistic content, interactive controls, clear status feedback, and responsive layout.
Open and runField Clip Box Bookmark Organizer
In the field clipping box scenario, complete the bookmark organizer: includes real content, actionable controls, clear status feedback, and cross-size layouts.
Open and runGreenhouse Log Paged Data Table
Complete a paginated data table in a greenhouse journal scenario: includes real content, actionable controls, clear state feedback, and cross-size layouts.
Open and runResponsive Masonry Layout Class Guide
Complete a responsive masonry layout in a classroom guide scenario: includes real content, interactive controls, clear state feedback, and a responsive layout across sizes.
Open and runPodcast launch week countdown page
Complete the launch countdown page in the podcast launch week scenario: include real content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runFestival operations conversion funnel dashboard
Complete a conversion funnel panel in a festival operations scenario: includes real content, interactive controls, clear state feedback, and a cross-size layout.
Open and runCourse Seat Checkout Flow
Complete the checkout step flow in a course seat scenario: includes real content, actionable controls, clear status feedback, and responsive layout across sizes.
Open and runPublic Poster Reading Measure Adjustment
Complete reading measure adjustment in a public poster scenario: includes real content, actionable controls, clear status feedback, and responsive layouts.
Open and runOutpatient Check-in Flip Transition
Complete a page-turn state transition for a clinic check-in scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runCoral Garden kaleidoscope pattern
Complete a kaleidoscope pattern in a coral garden scene: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runPublic Feedback Interactive Bar Chart
Create an interactive bar chart for a public feedback scenario: with real content, actionable controls, clear state feedback, and responsive layouts.
Open and runClass Tablet Full-Screen Stage Control
Completed a full-screen stage control for a classroom tablet scenario: includes real content, interactive controls, clear state feedback, and cross-size layout.
Open and runClassroom Challenge Desk Quick Quiz
Complete the rapid knowledge quiz in the Classroom Challenge Desk scenario: includes realistic content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runCafeteria Check-in Desk Date Quick Select
Complete rapid date selection in a pantry check-in desk scenario: includes real content, interactive controls, clear state feedback, and responsive layouts across sizes.
Open and runHousing registration live validation form
Complete an instant-validation form for a housing check-in scenario: includes realistic content, actionable controls, clear status feedback, and responsive layouts across sizes.
Open and runOutpatient Guide Wall process progress navigation
Complete a progress navigation flow in a clinic guide wall scenario: includes realistic content, interactive controls, clear status feedback, and responsive layouts across sizes.
Open and run