Design Lounge
Install

Library

600+ live pieces. Narrow by type, platform, section or style, then open one to see it live and copy its brief.

Pieces

Sort
Nº 605Animation · Web

ASCII ocean with sharks

A canvas ocean drawn as a monospace character grid: procedural sharks that flex, a school that parts around the pointer, caustics, kelp and a hero plate.

Nº 604Screen · Mobile app

Onboarding personality quiz

A five-question Material 3 Expressive onboarding quiz with big tonal answer cards, a wavy progress bar, back, and a result card that says what the app will set up.

Nº 603Component · Web

Vinyl record player

A music player built around a turntable: the disc spins while playing, the tonearm swings on and tracks inward across the side, with a drag scrubber and A/B tracklist.

Nº 602Screen · Web

Store locator with synced map

A 440px searchable, filterable workshop list beside a hand-drawn SVG city map whose pins sync with the list, live opening hours and a drawn bike route.

Nº 601Screen · Web

Lamp configurator with materials

A product page for an SVG table lamp: material, glaze and size radio groups redraw it, with a live price breakdown, delivery window and add to bag.

Nº 600Screen · Web

Dashboard with assistant insights

A weekly shop dashboard where an assistant writes three insight cards above the charts; each card lights its chart, explains why, and takes feedback.

Nº 599Screen · Web

Spatial glass windows

Three floating glass windows at different depths over a soft room-light scene, with ornament toolbars, a window that comes forward on focus, and gaze hover.

Nº 598Animation · Web

Scroll ring carousel

Ten film posters on a 3D ring that turns 36 degrees per card with scroll, drag or arrow keys, snaps to the front card and swaps the 76px title below.

Nº 597Animation · Web

Scroll exploding product grid

Twelve product cards lie scattered and tilted under the headline, then fly into a tidy 6 x 2 grid as the pinned section scrolls, and scatter again on the way back.

Nº 596Animation · Web

Scroll mask reveal sequence

Four drawn landscapes on a pinned stage; each next scene opens through a circle that grows out of the current scene's sun or moon as you scroll.

Nº 595Animation · Web

Parallax cursor gallery

A salon-hung museum wall of drawn gouaches whose frames and paint layers drift at depths with the pointer, plus a focus mode that FLIPs one work up to full size.

Nº 594Animation · Web

Scroll-morphing playlist header

A 500px playlist header whose 260px cover and 104px title shrink into a 72px sticky bar on one registered --p driven by a CSS scroll timeline.

Nº 593Animation · Web

Scroll-driven chapters

A long read in four chapters on CSS view timelines: a chapter rail fills as you read, each chapter tints the page, and its drawn plate settles from 1.22x.

Nº 592Screen · Web

Receipt email

A plain, trustworthy order receipt as a 600px table email: confirmation, order number, delivery estimate with steps, line items, totals with VAT, payment, address and help.

Nº 591Screen · Web

Product launch email

A launch email for an invented code-review tool: dark hero with a drawn product shot, three changes with tiny visuals, one orange button and a reply-to-me sign-off.

Nº 590Screen · Web

Editorial newsletter email

A weekly editorial newsletter as a real 600px table email: Playfair masthead, a drawn lead image, three short items, a pull quote and a footer, with a dark-mode set.

Nº 589Screen · Mobile web

Link-in-bio bento

A creator's link-in-bio page as a bento of tiles: profile, socials, a drawn latest-work tile, a playable podcast card, a shop drop and a workshop. Tiles press in on tap.

Nº 588Animation · Mobile app

Year-in-review story cards

Six tap-through year-in-review story cards for a reading app: segmented progress, giant Anton numbers, a top five, a reading-hours ring and a share card with replay.

Nº 587Screen · Web

Roadmap swimlanes

A dark product roadmap: four quarters across, team swimlanes down, status-coloured bars you drag along time by weeks, a today line, a freeze band and a team filter.

Nº 586Screen · Web

Moodboard canvas

A pannable, zoomable moodboard: swatches, type specimens, drawn photos, sticky notes and marker arrows pinned on a dotted board, each lifting on hover.

Nº 585Screen · Web

Metal card landing

A dark luxe landing page for a titanium card: Bodoni headline, a CSS brushed-metal card whose sheen and tilt follow the pointer, fees in plain numbers, apply CTA.

Nº 584Screen · Mobile app

Send crypto with hold to send

A three-step send flow on graphite: keypad with a dollar/coin switch, address with paste and QR, slow/normal/fast fees, and a review that sends on a 1.2s hold.

Nº 583Screen · Web

Invoice builder with live PDF

A freelancer's invoice form on ink-slate beside a live A4 preview: client picker, net terms, editable line items, discount and tax, a send that stamps the page.

Nº 582Screen · Mobile app

Budget envelopes

Material 3 envelope budgeting: envelopes that fill as you spend, one overspent in coral, drag one onto another or use the sheet to move money, month switcher.

Nº 581Screen · Mobile app

Card controls with frost freeze

iOS card settings: a drawn copper debit card that ices over when frozen, a monthly limit slider with a spent marker, where-it-works switches and declines.

Nº 580Screen · Web

Portfolio dashboard

A calm investing dashboard: a 64px serif total, range tabs over a scrubbable value chart, an allocation ring, a rebalance card and a holdings table.

Nº 579Animation · Mobile app

Gacha pull reveal

A manga-styled summon on a phone: focus lines and a spinning seal charge up, a flash bursts, and a character card flips in lit by its rarity colour.

Nº 578Screen · Web

Adventure quest map

An island world map in SVG with quest nodes that are done, active, open or locked, a dotted trail that draws to the chosen quest, and a quest panel.

Nº 577Screen · Web

Motorsport race results

A broadcast-style results screen: a rising podium with giant numerals, a lap table with purple, green and yellow sectors, gap or interval, and a next race card.

Nº 576Screen · Web

Cozy farm HUD

A farming-sim HUD over a painterly SVG field: a stitched day clock with a moving sun, an energy bar, a wooden hotbar, and a quest note pinned like paper.

Nº 575Screen · Web

Sci-fi loadout screen

A sci-fi armoury: cut-corner panels, a weapon and module list, a hologram drawn in SVG that redraws on swap, and stat bars that show gains and losses.

Nº 574Screen · Web

Fantasy RPG inventory

An ornate RPG satchel: an 8 by 6 slot grid with rarity frames, an equipped paper doll, and a pinned item card with stats, lore and a compare line.

Nº 573Component · Web

Spotlight onboarding tour

A four-stop coach-mark tour over an invoicing app: a spotlight cutout that glides between targets, a dark popover with step count, Back, Next and Skip.

Nº 572Component · Web

What's new slides modal

A 580px What's new modal with three slides of drawn product scenes, pill dots, previous and next, Remind me later, and arrow-key paging.

Nº 571Component · Web

Honest exit-intent offer popup

A shop's leave-the-page popup with one offer and the real reason for it, an email field, a full-size No thanks, and a soft 640ms rise. No dark patterns.

Nº 570Component · Web

Share and invite dialog

A 540px share dialog: email chips with live validation, a role per person, pending invites with Resend, and a link-access switch with Copy link.

Nº 569Component · Web

Three-step wizard dialog

A 560px creation wizard in one modal: details, members, review, with a step track, per-step validation and a panel height that animates between steps.

Nº 568Component · Web

Type-to-confirm delete dialog

A destructive confirm that lists what will be lost with counts, enables Delete only when the project name is typed exactly, and shakes on a wrong character.

Nº 567Component · Web

Chat history sidebar

An AI chat sidebar: teal New chat, live search with highlighted matches, history grouped Pinned, Today, Yesterday, 7 and 30 days, hover pin, rename and delete with undo.

Nº 566Component · Web

Floating island sidebar

A detached dark sidebar island 12px off every window edge: workspace switcher, ⌘K search that filters projects, a pinned trial card, and a 72px icon rail with tooltips.