HTML / CSS / JavaScript

Examples Library

Choose a complete case study to view the result, modify the source, and run it in the browser.

1046Page 27 of 44
Showing 24 examples
0625Floating layers and status feedback

Outpatient Proofreading Note Progress Overlay

Complete a progress blocker for an outpatient proofing note scenario: include realistic content, interactive controls, clear status feedback, and responsive layouts across sizes.

Floating layers and status feedbackProgress overlayHTMLCSSJavaScript
Open and run
0626Cards, Lists, and Content Organization

Sound Prompt Cards Task Board

Complete a Kanban board in a sound-prompt card scenario: includes real content, actionable controls, clear state feedback, and responsive layouts across sizes.

Cards, Lists, and Content OrganizationTask boardHTMLCSS GridJavaScript
Open and run
0627Tables and data display

Outpatient Roster Bulk Selection Table

A bulk selection table built for a clinic roster scenario: real content, actionable controls, clear status feedback, and responsive layouts across sizes.

Tables and data displayBatch selection tableHTML TableCSSJavaScript
Open and run
0628Page Layout and Responsive

Adaptive Gallery for Archive Guides

Create a responsive gallery in the archive guide scenario: includes real content, actionable controls, clear state feedback, and responsive layouts across sizes.

Page Layout and ResponsiveResponsive GalleryHTMLCSSJavaScript
Open and run
0629Marketing and content scenarios

Home Studio Case Study Page

Create a case study page for a home studio scenario: with real content, actionable controls, clear state feedback, and responsive layouts.

Marketing and content scenarioscase study pageHTMLCSS GridResponsive Design
Open and run
0630Dashboard and Admin Interfaces

Archive Review Board Resource Usage Panel

Complete the resource usage panel for the archive review board scenario, with real content, actionable controls, clear status feedback, and responsive layouts across sizes.

Dashboard and Admin InterfacesResource Usage PanelHTMLCSS GridJavaScript
Open and run
0631Business and Service Flows

Care Checkout Bag Order Tracking

Complete order progress tracking in a care checkout bag scenario: includes real content, actionable controls, clear state feedback, and responsive layouts.

Business and Service FlowsOrder Progress TrackingHTMLCSSJavaScript
Open and run
0632Typography and Text Effects

Archive Column Reading Measure Adjustment

Complete reading measure adjustment in the archive column scenario: includes real content, actionable controls, clear status feedback, and cross-size layouts.

Typography and Text EffectsReading Line Length AdjustmentHTMLCSS TypographyJavaScript
Open and run
0633Animation & Microinteractions

Orbital status animation catalog loop

Complete an orbital status animation in a catalog loop scene: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.

Animation & MicrointeractionsOrbital Status AnimationHTMLCSS AnimationJavaScript
Open and run
0634Creative Visual Effects

Kaleidoscope Pattern of Cloud Lake Garden

Complete a kaleidoscope pattern in the Cloud Lake Garden scene: with real content, interactive controls, clear state feedback, and responsive layouts across sizes.

Creative Visual EffectsKaleidoscope PatternHTMLCanvasJavaScript
Open and run
0635Drawing and Data Visualization

Air Forecast Board Dashboard Graphic

Complete dashboard graphics for the air forecast board scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.

Drawing and Data VisualizationDashboard chartsHTMLCanvasJavaScript
Open and run
0636Browser Media and Device Capabilities

Audio kiosk language and time zone panel

Complete a language and time zone panel in an audio kiosk scenario: includes real content, actionable controls, clear status feedback, and responsive layouts across sizes.

Browser Media and Device CapabilitiesLanguage and Time Zone PanelHTMLCSSBrowser API
Open and run
0637Mini Apps and Mini Games

Archive Assistant Box Tic-Tac-Toe

Complete tic-tac-toe in the archive helper box scenario: includes realistic content, interactive controls, clear status feedback, and responsive layouts.

Mini Apps and Mini GamesTic-Tac-ToeHTMLCSSJavaScript
Open and run
0638Basic Controls and Selectors

Greenhouse Lounge Numeric Stepper

Complete the numeric stepper in a greenhouse lounge setting: includes real content, interactive controls, clear state feedback, and a cross-size layout.

Basic Controls and SelectorsNumeric StepperHTMLCSSJavaScript
Open and run
0639Forms and input

Dynamic field group for exhibit review queue

In the exhibition review station scenario, complete the dynamic field group: including real content, actionable controls, clear status feedback, and responsive layouts.

Forms and inputDynamic Field GroupHTMLCSSJavaScript
Open and run
0640Navigation and Menus

Archive Route Map Workspace Tabs

Complete workspace tabs for an archive route map scenario, with realistic content, actionable controls, clear status feedback, and responsive layouts across sizes.

Navigation and MenusWorkspace tabsHTMLCSSJavaScript
Open and run
0641Floating layers and status feedback

Outpatient Review Desk Side Drawer

Complete the side drawer for a clinic review desk scenario: include realistic content, interactive controls, clear status feedback, and responsive layouts across sizes.

Floating layers and status feedbackSide drawerHTMLCSSJavaScript
Open and run
0642Cards, Lists, and Content Organization

Audio Directory Board Masonry Notes

Complete the masonry notes layout for a sound roster board scenario: includes real content, interactive controls, clear status feedback, and responsive layout across sizes.

Cards, Lists, and Content OrganizationWaterfall notesHTMLCSSJavaScript
Open and run
0643Tables and data display

Clinic Schedule Table Column Visibility Control

Complete column visibility control for an outpatient scheduling table scenario: includes real content, interactive controls, clear status feedback, and responsive layouts.

Tables and data displayColumn display controlHTML TableCSSJavaScript
Open and run
0644Page Layout and Responsive

Archive Display Bento Grid Layout

Create a bento-style grid layout for an archive display scenario: include real content, interactive controls, clear state feedback, and responsive layouts across sizes.

Page Layout and ResponsiveBento grid layoutHTMLCSS GridResponsive Design
Open and run
0645Marketing and content scenarios

Independent Product Comparison Page

Complete a product comparison page for an indie product scenario: includes real content, actionable controls, clear state feedback, and cross-size layouts.

Marketing and content scenariosProduct comparison pageHTML TableCSSJavaScript
Open and run
0646Dashboard and Admin Interfaces

Archive services trend analysis dashboard

Complete the trend analysis dashboard in the archive services network scenario: includes real content, actionable controls, clear state feedback, and a responsive layout.

Dashboard and Admin InterfacesTrend Analysis PanelHTMLCanvasJavaScript
Open and run
0647Basic Controls and Selectors

Greenhouse Plan Board Option Cards Selection

Complete plan card selection for a greenhouse plan board scenario: include realistic content, interactive controls, clear status feedback, and responsive layouts across sizes.

Basic Controls and SelectorsSolution card selectionHTMLCSSJavaScript
Open and run
0648Forms and input

Exhibition scheduling timetable time-slot booking sheet

Complete a time-slot booking form in an exhibition scheduling scenario: include real content, actionable controls, clear status feedback, and responsive layout across sizes.

Forms and inputTime Slot Booking SheetHTMLCSSJavaScript
Open and run