{"products":[{"id":2,"slug":"arachne","name":"Arachne","kind":"component","category":"layout","tagline":"A live clock whose hands are a spider's legs","description":"A working clock where a brass spider hanging from a thread tells the time. Good for: a watch shop, a Halloween page or a creative portfolio. How it works: The clock shows the real time, and the spider's legs move like clock hands as the minutes and seconds pass. How to use: Copy the files into your page and change the colours or text. Uses GSAP for animation.","priceCents":300,"sizeKb":5.5,"deps":0,"stack":["vanilla","css"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":10523,"likes":336,"relatedSlugs":["atelier","sleuth","aurelia"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:05.236Z","releases":[{"id":2,"version":"1.0.0","date":"2026-07-27","title":"First release","notes":"Arachne shipped as one file, with the reel recorded from the real page."}]},{"id":10,"slug":"arc","name":"Arc","kind":"component","category":"navigation","tagline":"A bottom tab bar with a ring of light that stretches","description":"A bottom navigation bar for phone screens with a glowing ring that marks the selected tab. Good for: mobile apps with a dark look. How it works: tap a tab and the ring stretches into a line of light toward it, then closes into a ring again. How to use: copy the files into your app and change the icons and labels. No libraries needed.","priceCents":700,"sizeKb":13.8,"deps":0,"stack":["vanilla","css"],"install":"","files":["app.js","index.html","style.css"],"downloads":0,"views":12835,"likes":390,"relatedSlugs":["lucid","meniscus","aurelia"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:05.843Z","releases":[{"id":10,"version":"1.0.0","date":"2026-08-15","title":"First release","notes":"Arc shipped as one file, with the reel recorded from the real page."}]},{"id":12,"slug":"atelier","name":"Atelier","kind":"component","category":"layout","tagline":"An add to cart button that packs the item into a bag","description":"A small shop section with two products and a shopping bag. Good for: online stores, product pages and shop demos. How it works: click add and the product picture leaves its card, flies across the page and drops into a cloth tote bag, which keeps what you added. How to use: copy the files into your shop and swap in your own products, photos and prices. No libraries needed.","priceCents":700,"sizeKb":15.4,"deps":0,"stack":["vanilla","css"],"install":"","files":["app.js","index.html","style.css"],"downloads":0,"views":8691,"likes":363,"relatedSlugs":["arachne","sleuth","aurelia"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:07.083Z","releases":[{"id":12,"version":"1.0.0","date":"2026-08-09","title":"First release","notes":"Atelier shipped as one file, with the reel recorded from the real page."}]},{"id":142,"slug":"atlas","name":"Atlas","kind":"component","category":"layout","tagline":"A 3D team slider where the centre person is in colour","description":"A team section that shows people as 3D portrait cards. Good for: team pages on agency or company sites. How it works: only the person in the middle is in colour. Drag it, scroll it or use the arrows, and it also moves on by itself. How to use: add one card per person with a name, role and colour, and replace the placeholder portraits with your own photos. Uses GSAP for the animation.","priceCents":500,"sizeKb":9.5,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":9651,"likes":415,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:07.692Z","releases":[{"id":207,"version":"1.0.0","date":"2026-09-02","title":"First release","notes":"First release: a 3D team coverflow where only the centred portrait is in colour, with drag, wheel, keys, autoplay and seven placeholder portraits."}]},{"id":1,"slug":"aurelia","name":"Aurelia","kind":"component","category":"animation","tagline":"Three flowers that grow and bloom at night","description":"Three pink flowers that grow and bloom on a dark night scene. Good for: a romantic page, a greeting or a calm landing hero. How it works: the stems rise, the leaves open and each bud blooms into a flower. Then they sway gently while small lights float up. How to use: copy the three files into your page. No libraries needed.","priceCents":300,"sizeKb":3.8,"deps":0,"stack":["vanilla","css"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":6848,"likes":263,"relatedSlugs":["parachute","wish","nova"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:08.297Z","releases":[{"id":1,"version":"1.0.0","date":"2026-07-26","title":"First release","notes":"Aurelia shipped as one file, with the reel recorded from the real page."}]},{"id":85,"slug":"axis","name":"Axis","kind":"component","category":"layout","tagline":"A drink product card that opens when you tap","description":"An interactive product card for a soft drink. Good for: a drink shop, a product launch or a brand page. How it works: tap the can and the card opens up, bubbles rise and the scene changes colour. Each flavour has its own colours. How to use: copy the files into your site and swap in your own photos and names. No libraries needed.","priceCents":500,"sizeKb":10,"deps":0,"stack":["vanilla","css","canvas","svg"],"install":"","files":["app.js","favicon.png","index.html","style.css"],"downloads":0,"views":4253,"likes":155,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:08.932Z","releases":[{"id":85,"version":"1.0.0","date":"2026-07-20","title":"First release","notes":"Axis shipped as one file, with the reel recorded from the real page."}]},{"id":116,"slug":"bead","name":"Bead","kind":"component","category":"form","tagline":"A download button whose outline is the progress bar","description":"A download button that turns into a round progress circle. Good for: download links for apps, files, PDFs or music. How it works: the button shrinks to a circle that fills with liquid while a small bead runs around its edge, then opens up again when the download ends. How to use: copy the files into your page and point it at your own file. No libraries needed.","priceCents":700,"sizeKb":16.8,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":5001,"likes":155,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:10.144Z","releases":[{"id":116,"version":"1.0.0","date":"2026-09-09","title":"First release","notes":"Bead shipped as one file, with the reel recorded from the real page."}]},{"id":110,"slug":"brim","name":"Brim","kind":"component","category":"form","tagline":"A download button that fills up like a glass","description":"A download button whose icon fills up like a glass of water. Good for: download links for apps, files, PDFs or music. How it works: the arrow turns into a spout, liquid pours in, and the level rises with the real download progress. How to use: copy the files into your page and point the button at your own file. No libraries needed.","priceCents":700,"sizeKb":15.2,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","glass.js","index.html","record-grid.html"],"downloads":0,"views":5064,"likes":219,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:11.366Z","releases":[{"id":110,"version":"1.0.0","date":"2026-09-05","title":"First release","notes":"Brim shipped as one file, with the reel recorded from the real page."}]},{"id":106,"slug":"caddy","name":"Caddy","kind":"component","category":"form","tagline":"An Add to cart button where a cart drives off","description":"An Add to cart button with a small animated shopping cart. Good for: product pages and product cards in an online shop. How it works: when the shopper presses the button, the item pops out, a cart rolls in, catches it and drives away. How to use: copy the files into your page and connect the button to your own cart. No libraries needed.","priceCents":300,"sizeKb":7.5,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":7928,"likes":305,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:11.998Z","releases":[{"id":106,"version":"1.0.0","date":"2026-09-02","title":"First release","notes":"Caddy shipped as one file, with the reel recorded from the real page."}]},{"id":46,"slug":"cart","name":"Cart","kind":"component","category":"form","tagline":"A Buy Now button that turns into a delivery truck","description":"A Buy Now button that turns into a small delivery truck and drives off the screen. Good for: online shops, product pages and checkout buttons. How it works: one tap packs the order, the button becomes a truck that drives away and leaves an Ordered message. How to use: copy the files into your page and connect the button to your own checkout. No libraries needed, just HTML, CSS and JavaScript.","priceCents":300,"sizeKb":5.9,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":10328,"likes":451,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:13.814Z","releases":[{"id":46,"version":"1.0.0","date":"2026-07-08","title":"First release","notes":"Cart shipped as one file, with the reel recorded from the real page."}]},{"id":136,"slug":"caustic","name":"Caustic","kind":"component","category":"form","tagline":"A Delete button whose bin eats its own label","description":"An animated Delete button with a small trash bin inside it. Good for: delete actions in apps, file managers and dashboards. How it works: press it and the bin lid opens and the letters of the label fall in one by one. The button turns into a round badge while the delete runs. How to use: copy the files into your project and connect your own delete action. No libraries needed.","priceCents":700,"sizeKb":13.6,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":7730,"likes":342,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:14.451Z","releases":[{"id":169,"version":"1.0.1","date":"2026-10-05","title":"No glow","notes":"The spinning colour halo behind the button while it deletes is gone, and its shadow is a plain dark one. The animation is otherwise unchanged."},{"id":136,"version":"1.0.0","date":"2026-09-21","title":"First release","notes":"Caustic shipped as one file, with the reel recorded from the real page."}]},{"id":127,"slug":"contrail","name":"Contrail","kind":"component","category":"form","tagline":"A Send button where a paper plane flies away","description":"A Send button with a paper plane that flies off and leaves a green trail. Good for: contact forms, chat apps and feedback boxes. How it works: press Send and the plane flies across the button, the green trail behind it fills the button, and the word SENT appears. How to use: copy the files into your site and run your own send code on press. No libraries needed.","priceCents":500,"sizeKb":10.8,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":3730,"likes":133,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:16.299Z","releases":[{"id":127,"version":"1.0.0","date":"2026-09-19","title":"First release","notes":"Contrail shipped as one file, with the reel recorded from the real page."}]},{"id":123,"slug":"crest","name":"Crest","kind":"component","category":"navigation","tagline":"A tab bar with a liquid drop marker","description":"A bottom navigation bar where the active tab is marked by a small wave of liquid. Good for: mobile apps, web apps and dashboards. How it works: tap a tab and the liquid flows along the bar to it, then a drop rises and fills the icon with colour. How to use: copy the files into your project, then change the icons, labels and links. No libraries needed.","priceCents":500,"sizeKb":9,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":5126,"likes":171,"relatedSlugs":["opal","surge","meridian"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:18.131Z","releases":[{"id":123,"version":"1.0.0","date":"2026-09-12","title":"First release","notes":"Crest shipped as one file, with the reel recorded from the real page."}]},{"id":135,"slug":"dart","name":"Dart","kind":"component","category":"form","tagline":"A Send button that folds into a paper plane","description":"A Send button that folds itself into a paper plane and throws it. Good for: contact forms and chat apps. How it works: press Send and the button folds like paper into a plane, the plane flies off the corner, then a check and the word Sent appear. How to use: copy the files into your site and run your own send code on press. No libraries needed.","priceCents":500,"sizeKb":10.4,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":9411,"likes":309,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:18.752Z","releases":[{"id":135,"version":"1.0.0","date":"2026-09-21","title":"First release","notes":"Dart shipped as one file, with the reel recorded from the real page."}]},{"id":109,"slug":"dash","name":"Dash","kind":"component","category":"form","tagline":"A round Add to cart button where the cart drives away","description":"A round Add to cart button with a small animated cart. Good for: product pages and product cards in an online shop. How it works: a ring fills around the button while the item is being added, then the cart drives off and a check mark slides in. How to use: copy the files into your page and connect the button to your own cart. No libraries needed.","priceCents":500,"sizeKb":11.7,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":12206,"likes":386,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:19.372Z","releases":[{"id":109,"version":"1.0.0","date":"2026-09-02","title":"First release","notes":"Dash shipped as one file, with the reel recorded from the real page."}]},{"id":17,"slug":"decant","name":"Decant","kind":"component","category":"animation","tagline":"Glass toggle buttons that fill with liquid when pressed","description":"Three glass toggle buttons for focus modes like Sleep and Do Not Disturb. Good for: settings screens and app control panels. How it works: press a button and liquid pours out from the spot you pressed. Pick another and the first drains away while the new one fills. Keyboard: arrow keys and screen readers work. How to use: copy the files into your app. No libraries needed.","priceCents":700,"sizeKb":13.4,"deps":0,"stack":["vanilla","css","canvas"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":7887,"likes":284,"relatedSlugs":["aurelia","parachute","wish"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:21.189Z","releases":[{"id":17,"version":"1.0.0","date":"2026-08-11","title":"First release","notes":"Decant shipped as one file, with the reel recorded from the real page."}]},{"id":90,"slug":"decibel","name":"Decibel","kind":"component","category":"form","tagline":"A volume slider that shows how loud it really is","description":"A music player whose volume slider shows how loud that level really is. Good for: a music app, a headphone shop or a hearing health site. How it works: Drag the volume up and the picture changes from an earbud to traffic, big speakers and a jet engine, with the safe listening time. How to use: Copy the files into your page and add your own music. No libraries needed.","priceCents":500,"sizeKb":10.5,"deps":0,"stack":["vanilla","css","canvas","svg"],"install":"","files":["app.js","index.html","style.css"],"downloads":0,"views":5000,"likes":230,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:21.824Z","releases":[{"id":90,"version":"1.0.0","date":"2026-07-24","title":"First release","notes":"Decibel shipped as one file, with the reel recorded from the real page."}]},{"id":99,"slug":"deck","name":"Deck","kind":"component","category":"form","tagline":"A four-digit code field that shuffles like playing cards","description":"A four-digit code field with a playful card animation. Good for: login or payment pages that send a one-time code. How it works: when the last digit is typed, the four boxes fan out like a hand of cards and turn into one tile with a check mark. How to use: copy the files into your page and connect the field to your own code check. No libraries needed.","priceCents":1000,"sizeKb":15,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":5547,"likes":215,"relatedSlugs":["pebble","signet","hoot"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:22.430Z","releases":[{"id":99,"version":"1.0.0","date":"2026-08-24","title":"First release","notes":"Deck shipped as one file, with the reel recorded from the real page."}]},{"id":50,"slug":"delete","name":"Delete","kind":"component","category":"form","tagline":"A Delete button that shreds a page into a bin","description":"An animated Delete button with a small working bin. Good for: delete actions in apps, file lists and dashboards. How it works: click it and the bin grows, a sheet of paper drops in and comes out as shredded strips. A checkmark appears and the button resets. How to use: copy the three files into your project and connect your own delete action. No libraries needed.","priceCents":500,"sizeKb":11.8,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":4155,"likes":160,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:23.035Z","releases":[{"id":50,"version":"1.0.0","date":"2026-07-25","title":"First release","notes":"Delete shipped as one file, with the reel recorded from the real page."}]},{"id":20,"slug":"depot","name":"Depot","kind":"component","category":"form","tagline":"An order button where a van picks up your parcel","description":"A checkout button that shows a small delivery scene when clicked. Good for: shop checkouts, place order buttons and delivery services. How it works: press it and a van drives in inside the button, loads a parcel and drives away. Then the button turns into a check mark. How to use: copy the files into your shop and connect the button to your own order step. No libraries needed.","priceCents":500,"sizeKb":9.6,"deps":0,"stack":["vanilla","css"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":9080,"likes":325,"relatedSlugs":["sigil","bamboo","mochi"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:24.244Z","releases":[{"id":20,"version":"1.0.0","date":"2026-08-11","title":"First release","notes":"Depot shipped as one file, with the reel recorded from the real page."}]},{"id":67,"slug":"dispatch","name":"Dispatch","kind":"component","category":"form","tagline":"A Buy Now button that packs and ships the order","description":"A Buy Now button that shows your order being packed and shipped. Good for: an online shop, a product page or a checkout step. How it works: Press Buy Now, the sneaker packs itself into a box, a van picks it up and drives away, and the order is confirmed. How to use: Swap in your own product picture and connect the button to your checkout. Uses GSAP for animation.","priceCents":700,"sizeKb":15.7,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":6505,"likes":241,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:24.850Z","releases":[{"id":67,"version":"1.0.0","date":"2026-07-13","title":"First release","notes":"Dispatch shipped as one file, with the reel recorded from the real page."}]},{"id":52,"slug":"ember","name":"Ember","kind":"component","category":"animation","tagline":"Hold the egg to hatch a tiny dragon","description":"An egg that hatches a cute baby dragon when you hold it. Good for: a fun landing page, a game site or a playful surprise. How it works: Press and hold the egg to warm it, cracks spread, and a tiny dragon pops out and blinks at you. How to use: Copy the files into your page and change the colours or text. No libraries needed.","priceCents":500,"sizeKb":11.4,"deps":0,"stack":["vanilla","css","canvas","svg"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":7341,"likes":283,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:26.062Z","releases":[{"id":52,"version":"1.0.0","date":"2026-07-10","title":"First release","notes":"Ember shipped as one file, with the reel recorded from the real page."}]},{"id":130,"slug":"gild","name":"Gild","kind":"component","category":"animation","tagline":"A favourite button that makes a new shiny star","description":"A favourite button whose star pops out and comes back as a new golden star. Good for: likes, bookmarks and wishlists. How it works: press it and the star flips out, gets pulled back in, then a fresh star rises out and lands in place. How to use: copy the files into your project and save the favourite in your app on press. No libraries needed.","priceCents":500,"sizeKb":11.8,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":8995,"likes":462,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:29.164Z","releases":[{"id":130,"version":"1.0.0","date":"2026-09-19","title":"First release","notes":"Gild shipped as one file, with the reel recorded from the real page."}]},{"id":114,"slug":"glance","name":"Glance","kind":"component","category":"form","tagline":"A Pay button that checks your face before paying","description":"A Pay button that shows a Face ID check inside the button itself. Good for: checkout and payment pages in an online shop or app. How it works: the button shrinks into a face scan icon while the payment runs, then opens back up to show the result. How to use: copy the files into your page and connect the button to your own payment service. No libraries needed.","priceCents":500,"sizeKb":10.5,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":5239,"likes":237,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:29.770Z","releases":[{"id":114,"version":"1.0.0","date":"2026-09-08","title":"First release","notes":"Glance shipped as one file, with the reel recorded from the real page."}]},{"id":121,"slug":"glyph","name":"Glyph","kind":"component","category":"animation","tagline":"Buttons whose letters move when you hover","description":"A set of buttons where the letters of the label move on hover. Good for: call-to-action buttons on landing pages, shops and portfolios. How it works: hover or tap and the letters drive, jump or puff like smoke, starting from the side the cursor came in. How to use: copy the files into your site, pick one of the three effects per button and change the text. No libraries needed.","priceCents":500,"sizeKb":9.4,"deps":0,"stack":["vanilla","css"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":9275,"likes":349,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:30.376Z","releases":[{"id":121,"version":"1.0.0","date":"2026-09-15","title":"First release","notes":"Glyph shipped as one file, with the reel recorded from the real page."}]},{"id":112,"slug":"gulp","name":"Gulp","kind":"component","category":"form","tagline":"A delete button where the bin eats the word Delete","description":"A delete button with a small bin that really eats its label. Good for: deleting files, messages or items in an app. How it works: when pressed, the letters fall into the bin one by one, the button turns into a round loader, then the bin empties with a small burst. How to use: copy the files into your page and connect the button to your own delete action. No libraries needed.","priceCents":900,"sizeKb":13.3,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":3583,"likes":140,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:31.589Z","releases":[{"id":112,"version":"1.0.0","date":"2026-09-21","title":"First release","notes":"Gulp shipped as one file, with the reel recorded from the real page."}]},{"id":15,"slug":"gyre","name":"Gyre","kind":"component","category":"form","tagline":"Four code boxes that spin into one check mark","description":"A four-digit code field for one-time passwords. Good for: login checks, two-step verification and phone or email confirmation. How it works: when all four digits are in, the boxes move into a circle and spin, then join into one tile that turns into a check mark. How to use: copy the files into your page and connect the code to your own check. No libraries needed.","priceCents":1000,"sizeKb":19.9,"deps":0,"stack":["vanilla","css"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":9328,"likes":373,"relatedSlugs":["sigil","bamboo","mochi"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:32.807Z","releases":[{"id":15,"version":"1.0.0","date":"2026-08-08","title":"First release","notes":"Gyre shipped as one file, with the reel recorded from the real page."}]},{"id":60,"slug":"halo","name":"Halo","kind":"component","category":"layout","tagline":"Headphone product cards that tilt and glow on hover","description":"Three product cards for headphones with floating product photos. Good for: an electronics shop or a product launch page. How it works: the cards rise in on load and tilt toward your mouse with a soft shine. On hover the headphones lift forward and sound rings pulse. Includes: a dark and light mode switch. How to use: swap in your own photos and prices, it uses GSAP for animation.","priceCents":300,"sizeKb":6.4,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["index.html","script.js","style.css","vanilla-tilt.min.js"],"downloads":0,"views":7965,"likes":311,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:34.108Z","releases":[{"id":60,"version":"1.0.0","date":"2026-07-11","title":"First release","notes":"Halo shipped as one file, with the reel recorded from the real page."}]},{"id":107,"slug":"hop","name":"Hop","kind":"component","category":"animation","tagline":"A loading spinner where the last dot jumps to the front","description":"A loading spinner made of twelve dots in a ring. Good for: any app, form or website. How it works: every third of a second the last dot jumps across the gap to the front and it stays calm for people who turn off motion. How to use: copy the files into your page and show it while your content loads. No libraries needed.","priceCents":300,"sizeKb":6.2,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":6979,"likes":355,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:35.949Z","releases":[{"id":107,"version":"1.0.0","date":"2026-09-02","title":"First release","notes":"Hop shipped as one file, with the reel recorded from the real page."}]},{"id":131,"slug":"keel","name":"Keel","kind":"component","category":"form","tagline":"An upload button whose arrow becomes a water level","description":"An upload button whose arrow turns into a little water gauge that shows progress. Good for: upload forms and file sharing apps. How it works: press it and the arrow folds down, then water rises in the box with a small float on top. Includes: four colour styles. How to use: copy the files into your site and connect the button to your upload address. No libraries needed.","priceCents":700,"sizeKb":15.6,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":3371,"likes":142,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:39.009Z","releases":[{"id":131,"version":"1.0.0","date":"2026-09-21","title":"First release","notes":"Keel shipped as one file, with the reel recorded from the real page."}]},{"id":101,"slug":"keep","name":"Keep","kind":"component","category":"form","tagline":"A crypto wallet welcome screen with a moving 3D coin","description":"A four-slide welcome screen for a crypto wallet app with one 3D coin that never leaves the screen. Good for: a wallet or finance app. How it works: the visitor swipes or taps the dots, and the coin shows sending, swapping, buying with a card and saving in a vault. How to use: change the text to fit your app. Built with HTML, CSS and JavaScript, using Three.js for the 3D coin.","priceCents":700,"sizeKb":18.4,"deps":1,"stack":["vanilla","css","svg","three"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":4679,"likes":180,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:39.615Z","releases":[{"id":101,"version":"1.0.0","date":"2026-08-25","title":"First release","notes":"Keep shipped as one file, with the reel recorded from the real page."}]},{"id":34,"slug":"lamp","name":"Lamp","kind":"component","category":"animation","tagline":"A cute desk lamp that wakes when you pull its cord","description":"A cartoon desk lamp that sleeps until you pull its cord. Good for: a fun landing page, a dark mode switch or a playful hero. How it works: drag the cord down and let go, the switch clicks, the lamp lifts its head and the light turns on. A tap or the Enter key works too. How to use: copy the three files into your page. No libraries needed.","priceCents":300,"sizeKb":7.6,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["index.html","lamp.css","lamp.js"],"downloads":0,"views":11298,"likes":472,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:44.560Z","releases":[{"id":34,"version":"1.0.0","date":"2026-06-27","title":"First release","notes":"Lamp shipped as one file, with the reel recorded from the real page."}]},{"id":4,"slug":"lucid","name":"Lucid","kind":"component","category":"navigation","tagline":"A glass tab bar with a sun and moon theme switch","description":"A floating tab bar that looks like real glass, with a light and dark switch. Good for: switching sections in an app or a settings page. How it works: the page behind bends at the edges like glass, and the selected tab stretches as it slides. The sun turns into a moon in dark mode. How to use: copy the files into your site and rename the tabs. No libraries needed.","priceCents":500,"sizeKb":8,"deps":0,"stack":["vanilla","css"],"install":"","files":["app.js","index.html","style.css"],"downloads":0,"views":8835,"likes":297,"relatedSlugs":["meniscus","arc","aurelia"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:50.817Z","releases":[{"id":4,"version":"1.0.0","date":"2026-07-29","title":"First release","notes":"Lucid shipped as one file, with the reel recorded from the real page."}]},{"id":134,"slug":"lumen-toggle","name":"Lumen Toggle","kind":"component","category":"animation","tagline":"A dark mode switch that spreads the new theme","description":"A light and dark mode switch with a circle reveal. Good for: any website, blog, portfolio or app with a dark mode. How it works: click the button and the new theme spreads out from it in a growing circle, while the sun and moon icon turns. How to use: copy the files into your site and set your own light and dark colours. No libraries needed.","priceCents":500,"sizeKb":8.6,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":7144,"likes":292,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:52.128Z","releases":[{"id":134,"version":"1.0.0","date":"2026-09-19","title":"First release","notes":"Lumen Toggle shipped as one file, with the reel recorded from the real page."}]},{"id":120,"slug":"maw","name":"Maw","kind":"component","category":"form","tagline":"A delete button that zooms into its trash can","description":"A delete button where the trash can grows big and swallows the button's label. Good for: deleting files, messages or cart items in any app. How it works: press it and the bin grows bigger than the button, the lid swings open, and the word falls inside. How to use: copy the files into your project and run your own delete code on press. No libraries needed.","priceCents":500,"sizeKb":11.8,"deps":0,"stack":["vanilla","css"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":10468,"likes":405,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:56.439Z","releases":[{"id":120,"version":"1.0.0","date":"2026-09-13","title":"First release","notes":"Maw shipped as one file, with the reel recorded from the real page."}]},{"id":8,"slug":"meniscus","name":"Meniscus","kind":"component","category":"navigation","tagline":"A bottom tab bar that moves like liquid","description":"A bottom navigation bar for phone screens that moves like liquid. Good for: mobile apps and phone-sized web apps. How it works: the selected tab sits in a dip in the bar, and the dip slides and stretches as you move to another tab. You can also drag it. How to use: copy the files into your app and change the icons and labels. No libraries needed.","priceCents":1200,"sizeKb":8.7,"deps":1,"stack":["vanilla","css"],"install":"","files":["app.js","index.html","style.css"],"downloads":0,"views":12220,"likes":419,"relatedSlugs":["lucid","arc","aurelia"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:57.711Z","releases":[{"id":8,"version":"1.0.0","date":"2026-08-01","title":"First release","notes":"Meniscus shipped as one file, with the reel recorded from the real page."}]},{"id":47,"slug":"mood","name":"Mood","kind":"component","category":"form","tagline":"A feedback slider with a face that changes mood","description":"A feedback slider with a big face that goes from sad to happy as you drag it. Good for: customer feedback forms, reviews and surveys. How it works: drag the slider and the face goes from sad to happy to in love, and the background colour changes to match. How to use: copy the files into your page and send the slider value to your own feedback form. No libraries needed, just HTML, CSS and JavaScript.","priceCents":500,"sizeKb":9.6,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":3155,"likes":114,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:00.207Z","releases":[{"id":47,"version":"1.0.0","date":"2026-07-09","title":"First release","notes":"Mood shipped as one file, with the reel recorded from the real page."}]},{"id":124,"slug":"nimbus","name":"Nimbus","kind":"component","category":"form","tagline":"A publish button with a rolling cloud animation","description":"A Publish button with rolling clouds while your post is saved. Good for: blogs, content tools and any form that saves. How it works: press it and clouds roll by while the work runs, then the last one turns into a checkmark. Includes: light and dark versions. How to use: copy the files into your site and run your own save code on press. No libraries needed.","priceCents":500,"sizeKb":9.5,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":6683,"likes":281,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:02.688Z","releases":[{"id":124,"version":"1.0.0","date":"2026-09-13","title":"First release","notes":"Nimbus shipped as one file, with the reel recorded from the real page."}]},{"id":108,"slug":"nought","name":"Nought","kind":"component","category":"layout","tagline":"A 404 error page with wind that blows the page around","description":"A friendly 404 error page with an animated illustration. Good for: any website or web app. How it works: wind blows through the picture, tilts the headline and sends paper flying, and moving the cursor makes wind too. How to use: copy the files into your site and change the text. Built with HTML, CSS and JavaScript, using the Lottie player for the illustration.","priceCents":500,"sizeKb":10.2,"deps":1,"stack":["vanilla","css","svg","lottie-web"],"install":"","files":["README.md","app.css","app.js","index.html","lonely-404.json","still.svg"],"downloads":0,"views":10539,"likes":421,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:05.140Z","releases":[{"id":108,"version":"1.0.0","date":"2026-09-02","title":"First release","notes":"Nought shipped as one file, with the reel recorded from the real page."}]},{"id":111,"slug":"nudge","name":"Nudge","kind":"component","category":"form","tagline":"A Get in touch button that reacts when you hover","description":"A Get in touch button that reacts like you poked it. Good for: a portfolio, agency site or landing page. How it works: the button tilts away from the cursor, fills with colour and changes its text to Don't be shy with an arrow. How to use: copy the files into your page and link the button to your email or contact form. No libraries needed.","priceCents":500,"sizeKb":8.2,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":9082,"likes":457,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:06.351Z","releases":[{"id":111,"version":"1.0.0","date":"2026-09-07","title":"First release","notes":"Nudge shipped as one file, with the reel recorded from the real page."}]},{"id":102,"slug":"opal","name":"Opal","kind":"component","category":"navigation","tagline":"A glass navigation bar with a soft stretchy highlight","description":"A floating glass navigation bar that bends the background behind it like real glass. Good for: the menu of a website, app or portfolio. How it works: when the visitor picks a menu item, the highlight stretches toward it like a drop of liquid and then settles in place. How to use: copy the files into your page and change the menu links to your own. No libraries needed.","priceCents":700,"sizeKb":13.8,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":10506,"likes":395,"relatedSlugs":["surge","crest","meridian"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:07.562Z","releases":[{"id":102,"version":"1.0.0","date":"2026-08-31","title":"First release","notes":"Opal shipped as one file, with the reel recorded from the real page."}]},{"id":3,"slug":"parachute","name":"Parachute","kind":"component","category":"animation","tagline":"A download button with a parachuting arrow","description":"A download button where the arrow floats down on a parachute. Good for: an app download page, a file sharing site or a software shop. How it works: Press it, the ring opens into a progress bar, and the bar follows the real download, which you can cancel. How to use: Copy the files and point the button at your own file. No libraries needed.","priceCents":500,"sizeKb":9.2,"deps":0,"stack":["vanilla","css"],"install":"","files":["app.js","index.html","style.css"],"downloads":0,"views":6038,"likes":222,"relatedSlugs":["aurelia","wish","nova"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:10.591Z","releases":[{"id":3,"version":"1.0.0","date":"2026-07-28","title":"First release","notes":"Parachute shipped as one file, with the reel recorded from the real page."}]},{"id":100,"slug":"pebble","name":"Pebble","kind":"component","category":"form","tagline":"A round glass sign-in form for login and sign up","description":"A sign-in form shaped like a round piece of glass sitting on a coloured background. Good for: the login page of an app or website. How it works: the glass edge bends the background behind it and Login and Sign Up are two sides of the same disc. How to use: copy the files into your page and connect the form to your own sign-in system. No libraries needed.","priceCents":700,"sizeKb":13,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":11074,"likes":421,"relatedSlugs":["deck","signet","hoot"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:11.904Z","releases":[{"id":100,"version":"1.0.0","date":"2026-08-25","title":"First release","notes":"Pebble shipped as one file, with the reel recorded from the real page."}]},{"id":118,"slug":"pivot","name":"Pivot","kind":"component","category":"form","tagline":"A chat message box with a tool tray that swings open","description":"A message box for chat apps with an attach button that opens a tool tray. Good for: chat apps, support chats or AI assistants. How it works: when the attach button is pressed, the text field swings away and a row of tools swings in, and the box keeps the same size. How to use: copy the files into your page and connect it to your own app. No libraries needed.","priceCents":700,"sizeKb":13.1,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":9371,"likes":461,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:13.848Z","releases":[{"id":118,"version":"1.0.0","date":"2026-09-09","title":"First release","notes":"Pivot shipped as one file, with the reel recorded from the real page."}]},{"id":122,"slug":"plimsoll","name":"Plimsoll","kind":"component","category":"form","tagline":"An upload button that fills with liquid as it uploads","description":"An upload button that fills with liquid to show how much has been sent. Good for: upload forms and file sharing apps. How it works: press it and liquid rises inside the button, and the text changes colour as the liquid passes it. The level follows the real upload. How to use: copy the files into your site and connect the button to your upload address. No libraries needed.","priceCents":700,"sizeKb":18.9,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":3648,"likes":177,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:14.453Z","releases":[{"id":122,"version":"1.0.0","date":"2026-09-13","title":"First release","notes":"Plimsoll shipped as one file, with the reel recorded from the real page."}]},{"id":126,"slug":"plume","name":"Plume","kind":"component","category":"form","tagline":"A Subscribe button that folds into a paper plane","description":"An email signup box with a Subscribe button that folds into a paper plane. Good for: newsletters, waitlists, blogs and coming-soon pages. How it works: the visitor types an email and presses Subscribe, then the button folds into a paper plane and throws it away. How to use: copy the files into your site and connect the form to your email service. No libraries needed.","priceCents":700,"sizeKb":19.8,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":12438,"likes":411,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:15.057Z","releases":[{"id":126,"version":"1.0.0","date":"2026-09-13","title":"First release","notes":"Plume shipped as one file, with the reel recorded from the real page."}]},{"id":88,"slug":"pulse","name":"Pulse","kind":"component","category":"animation","tagline":"A glowing heart made of connected dots","description":"An animated heart made of hundreds of glowing dots joined by lines. Good for: a love message, a health or charity page, or a landing page background. How it works: The dots drift and link up into a beating heart, moving your mouse makes it ripple, and a click sends a pulse. How to use: Copy the files into your page and change the colours. No libraries needed.","priceCents":500,"sizeKb":9,"deps":0,"stack":["vanilla","css","canvas","svg"],"install":"","files":["app.js","index.html","style.css"],"downloads":0,"views":7225,"likes":330,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:18.691Z","releases":[{"id":88,"version":"1.0.0","date":"2026-07-24","title":"First release","notes":"Pulse shipped as one file, with the reel recorded from the real page."}]},{"id":11,"slug":"quarto","name":"Quarto","kind":"component","category":"form","tagline":"Four code boxes that fold into one check mark","description":"A four-digit code field for one-time passwords. Good for: login checks, two-step verification and phone or email confirmation. How it works: when all four digits are in, the row folds into a square, the boxes join into one tile, and the tile turns into a check mark. How to use: copy the files into your page and connect the code to your own check. No libraries needed.","priceCents":1000,"sizeKb":16.1,"deps":0,"stack":["vanilla","css"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":8385,"likes":297,"relatedSlugs":["sigil","bamboo","mochi"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:19.324Z","releases":[{"id":11,"version":"1.0.0","date":"2026-08-03","title":"First release","notes":"Quarto shipped as one file, with the reel recorded from the real page."}]},{"id":23,"slug":"quench","name":"Quench","kind":"component","category":"form","tagline":"A submit button that fills up as it sends","description":"A submit button that shows its own progress. Good for: contact forms, file uploads, sign-up forms and any send button. How it works: after you click, the button stretches into a progress bar that fills along the bottom, then the color rises to fill the button and it shows sent. How to use: copy the files into your form and connect the button to your own submit step. No libraries needed.","priceCents":500,"sizeKb":11.9,"deps":0,"stack":["vanilla","css"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":5836,"likes":246,"relatedSlugs":["sigil","bamboo","mochi"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:19.988Z","releases":[{"id":23,"version":"1.0.0","date":"2026-08-20","title":"First release","notes":"Quench shipped as one file, with the reel recorded from the real page."}]},{"id":104,"slug":"relay","name":"Relay","kind":"component","category":"navigation","tagline":"A contact menu where the word CONTACT opens your links","description":"A contact menu where each letter of the word CONTACT is a button. Good for: a portfolio or personal site. How it works: the letters grow as the cursor passes over them and flip over to show your links like GitHub, LinkedIn and Instagram. How to use: copy the files into your page and put in your own links. No libraries needed.","priceCents":700,"sizeKb":15.3,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":4157,"likes":164,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:21.200Z","releases":[{"id":104,"version":"1.0.0","date":"2026-08-31","title":"First release","notes":"Relay shipped as one file, with the reel recorded from the real page."}]},{"id":128,"slug":"relief","name":"Relief","kind":"component","category":"animation","tagline":"Soft buttons that grow into a player and share menu","description":"Soft Play and Share buttons that grow into what they open. Good for: music, podcast and blog pages. How it works: press Play and the button widens into a small player with a pause icon and moving sound bars. Share: it grows a row of share options and a copy link button. How to use: copy the files into your site and add your own audio and links. No libraries needed.","priceCents":700,"sizeKb":13.9,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":3755,"likes":193,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:21.805Z","releases":[{"id":128,"version":"1.0.0","date":"2026-09-18","title":"First release","notes":"Relief shipped as one file, with the reel recorded from the real page."}]},{"id":37,"slug":"reptile","name":"Reptile","kind":"component","category":"animation","tagline":"A line-drawn lizard that crawls after your mouse","description":"A lizard drawn in thin lines that follows your mouse around the screen. Good for: a creative portfolio or a fun page background. How it works: move your mouse and the lizard crawls after it with real steps. Each page load makes a new creature with a different number of legs. Note: it works with a mouse, not touch. How to use: add the two files to your page. No libraries needed.","priceCents":300,"sizeKb":4.5,"deps":0,"stack":["vanilla"],"install":"","files":["index.html","script.js"],"downloads":0,"views":7781,"likes":348,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:22.411Z","releases":[{"id":37,"version":"1.0.0","date":"2026-07-01","title":"First release","notes":"Reptile shipped as one file, with the reel recorded from the real page."}]},{"id":119,"slug":"ripcord","name":"Ripcord","kind":"component","category":"form","tagline":"A download button that turns into its own progress bar","description":"A download button with a little parachute that shows progress. Good for: download pages and file sharing apps. How it works: press it and the ring opens into a progress bar while the arrow floats down on a parachute. Real progress: it follows the real download and can be cancelled. How to use: copy the files into your site and point the button at your file. No libraries needed.","priceCents":700,"sizeKb":15.2,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":14424,"likes":498,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:23.018Z","releases":[{"id":119,"version":"1.0.0","date":"2026-09-09","title":"First release","notes":"Ripcord shipped as one file, with the reel recorded from the real page."}]},{"id":16,"slug":"sable","name":"Sable","kind":"component","category":"form","tagline":"A checkout form with a card that fills in as you type","description":"A payment form with a credit card picture that fills in as you type. Good for: checkout and booking pages. How it works: the card shows each detail as you type and turns over for the security code. When you pay, it shows that the payment went through. How to use: copy the files into your site and connect it to your payment provider. Payments are not included. No libraries needed.","priceCents":700,"sizeKb":17.1,"deps":0,"stack":["vanilla","css"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":8375,"likes":282,"relatedSlugs":["sigil","bamboo","mochi"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:25.496Z","releases":[{"id":16,"version":"1.0.0","date":"2026-08-10","title":"First release","notes":"Sable shipped as one file, with the reel recorded from the real page."}]},{"id":78,"slug":"scoville","name":"Scoville","kind":"component","category":"form","tagline":"A spice level slider where the chili pepper catches fire","description":"A food order card with a spice level slider. Good for: a restaurant menu, a food delivery app or a hot sauce shop. How it works: drag the slider and the chili pepper next to it grows, sweats, cracks open and catches fire. Drag it back and the fire goes out. How to use: change the dish, price and text, it uses GSAP for animation.","priceCents":700,"sizeKb":18.2,"deps":1,"stack":["vanilla","css","canvas","svg","gsap"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":11997,"likes":409,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:26.131Z","releases":[{"id":78,"version":"1.0.0","date":"2026-07-16","title":"First release","notes":"Scoville shipped as one file, with the reel recorded from the real page."}]},{"id":129,"slug":"scry","name":"Scry","kind":"component","category":"form","tagline":"A search icon that opens into a search field","description":"A round search button that opens into a full search field. Good for: website headers, shops and blogs where space is tight. How it works: click the icon and the field slides open beside it, while the icon moves to the end and becomes a close button. How to use: copy the files into your site and connect the field to your own search. No libraries needed.","priceCents":500,"sizeKb":10.3,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":11632,"likes":415,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:26.751Z","releases":[{"id":129,"version":"1.0.0","date":"2026-09-18","title":"First release","notes":"Scry shipped as one file, with the reel recorded from the real page."}]},{"id":6,"slug":"sigil","name":"Sigil","kind":"component","category":"form","tagline":"A one-time code field that seals itself when complete","description":"A four-digit code field for one-time passwords. Good for: login checks, two-step verification and email or phone confirmation screens. How it works: each digit rolls into its box, the row is checked, then the four boxes fly together and join into one verified seal. How to use: copy the files into your page and connect the code to your own check. No libraries needed.","priceCents":1000,"sizeKb":12.2,"deps":0,"stack":["vanilla","css"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":8256,"likes":353,"relatedSlugs":["bamboo","mochi","quarto"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:27.356Z","releases":[{"id":6,"version":"1.0.0","date":"2026-07-30","title":"First release","notes":"Sigil shipped as one file, with the reel recorded from the real page."}]},{"id":103,"slug":"signet","name":"Signet","kind":"component","category":"form","tagline":"A one-time code field that looks pressed into gold","description":"A four-digit code field with a pressed-in look in black and gold. Good for: login or payment pages that send a one-time code. How it works: the boxes catch light from the cursor, each typed digit presses into the surface, and a correct code is stamped like a wax seal. How to use: copy the files into your page and connect it to your own code check. No libraries needed.","priceCents":700,"sizeKb":16.5,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":3760,"likes":152,"relatedSlugs":["deck","pebble","hoot"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:28.045Z","releases":[{"id":103,"version":"1.0.0","date":"2026-08-31","title":"First release","notes":"Signet shipped as one file, with the reel recorded from the real page."}]},{"id":132,"slug":"silo","name":"Silo","kind":"component","category":"form","tagline":"A download button that opens a box and fills it","description":"A square download button that opens a second box and fills it as the file downloads. Good for: download pages and file libraries. How it works: press it and a box opens beside the button, fills from the bottom with the real download, counts the megabytes and shows a check. How to use: copy the files into your site and point the button at your file. No libraries needed.","priceCents":700,"sizeKb":13,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":5602,"likes":229,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:28.696Z","releases":[{"id":132,"version":"1.0.0","date":"2026-09-18","title":"First release","notes":"Silo shipped as one file, with the reel recorded from the real page."}]},{"id":51,"slug":"snowglobe","name":"Snowglobe","kind":"component","category":"animation","tagline":"A snow globe you can shake to make it snow","description":"A snow globe with a tiny village inside that you can shake. Good for: a winter or holiday page or a Christmas greeting. How it works: drag the glass to shake it and the snow swirls faster the harder you shake. Let go or tap and a snowstorm fills the globe, then settles. Sound: soft wind and bells, with a mute button. How to use: copy the three files into your page. No libraries needed.","priceCents":500,"sizeKb":10.3,"deps":0,"stack":["vanilla","css","canvas","svg"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":3157,"likes":112,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:30.643Z","releases":[{"id":51,"version":"1.0.0","date":"2026-07-10","title":"First release","notes":"Snowglobe shipped as one file, with the reel recorded from the real page."}]},{"id":53,"slug":"solstice","name":"Solstice","kind":"component","category":"animation","tagline":"Drag a slider to move one tree through the seasons","description":"A tree that changes through all four seasons as you drag a slider. Good for: a garden or nature site, a weather page or a seasonal sale. How it works: Move the slider and the tree goes from buds to pink blossom, green leaves, golden leaves and winter snow. How to use: Copy the files into your page and edit the labels. No libraries needed.","priceCents":500,"sizeKb":11.1,"deps":0,"stack":["vanilla","css","canvas","svg"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":9676,"likes":384,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:32.588Z","releases":[{"id":53,"version":"1.0.0","date":"2026-07-10","title":"First release","notes":"Solstice shipped as one file, with the reel recorded from the real page."}]},{"id":97,"slug":"spindle","name":"Spindle","kind":"component","category":"form","tagline":"A one-time code field that opens a safe","description":"A six-digit code field drawn as the wheels inside a safe lock. Good for: two-step login, payment checks and any page where people enter a code. How it works: each digit turns one wheel, and when all six line up a bar drops into place and the lock opens. How to use: copy the files into your page and connect the code to your own check. No libraries needed.","priceCents":700,"sizeKb":14.2,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":6502,"likes":301,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:35.132Z","releases":[{"id":97,"version":"1.0.0","date":"2026-08-03","title":"First release","notes":"Spindle shipped as one file, with the reel recorded from the real page."}]},{"id":133,"slug":"splay","name":"Splay","kind":"component","category":"form","tagline":"A Share button that opens into share options","description":"A Share button that fans out into share options. Good for: blogs, articles, product pages and portfolios. How it works: press Share and three to five options spread out, then pick one and it fills with colour, flies back and shows a check. Real sharing: links open for real and copy link really copies. How to use: copy the files into your site and choose your channels. No libraries needed.","priceCents":700,"sizeKb":13.1,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":6506,"likes":215,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:35.763Z","releases":[{"id":133,"version":"1.0.0","date":"2026-09-18","title":"First release","notes":"Splay shipped as one file, with the reel recorded from the real page."}]},{"id":117,"slug":"surge","name":"Surge","kind":"component","category":"navigation","tagline":"A navigation menu with an underline that jumps like electricity","description":"A navigation menu with an underline that jumps between items like a spark of electricity. Good for: the menu or tabs of a website or app. How it works: when the visitor picks a new item, the underline stretches into a crackling line of light and snaps into place under it. How to use: copy the files into your page and change the menu items to your own. No libraries needed.","priceCents":500,"sizeKb":11.4,"deps":0,"stack":["vanilla","css"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":4313,"likes":170,"relatedSlugs":["opal","crest","meridian"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:38.935Z","releases":[{"id":117,"version":"1.0.0","date":"2026-09-12","title":"First release","notes":"Surge shipped as one file, with the reel recorded from the real page."}]},{"id":113,"slug":"swell","name":"Swell","kind":"component","category":"animation","tagline":"A button that fills with colour like a liquid on hover","description":"A button that fills with colour like a rising liquid when you hover over it. Good for: main buttons on landing pages, shops and portfolios. How it works: a wave of colour rises through the button and the letters float up one after another. How to use: copy the files into your page and change the text and colours to match your site. No libraries needed.","priceCents":300,"sizeKb":5.8,"deps":0,"stack":["vanilla","css"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":7981,"likes":313,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:39.539Z","releases":[{"id":113,"version":"1.0.0","date":"2026-09-08","title":"First release","notes":"Swell shipped as one file, with the reel recorded from the real page."}]},{"id":76,"slug":"swipe","name":"Swipe","kind":"component","category":"navigation","tagline":"Swipe a list item left to shred and delete it","description":"A list where you swipe an item left to delete it, like on a phone. Good for: a to do app or an inbox. How it works: Drag a row left and a trash bin opens, drag far enough and the row is shredded into it, and the list closes the gap. How to use: Copy the files and use your own list items and delete action. No libraries needed.","priceCents":700,"sizeKb":15.9,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":4372,"likes":231,"relatedSlugs":["tube","pivot","lucid"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:40.162Z","releases":[{"id":76,"version":"1.0.0","date":"2026-07-16","title":"First release","notes":"Swipe shipped as one file, with the reel recorded from the real page."}]},{"id":125,"slug":"tender","name":"Tender","kind":"component","category":"form","tagline":"A pay button that swipes a card through itself","description":"A Pay button that works like a card reader. Good for: checkout pages and online shops. How it works: press Pay and the card icon swipes through a slot, its line fills as a progress bar, and the button turns green with a check. How to use: copy the files into your checkout and run your own payment code on press, since payments are not included. No libraries needed.","priceCents":900,"sizeKb":13.1,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":15088,"likes":474,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"none","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:43.233Z","releases":[{"id":125,"version":"1.0.0","date":"2026-09-13","title":"First release","notes":"Tender shipped as one file, with the reel recorded from the real page."}]},{"id":137,"slug":"thrum","name":"Thrum","kind":"component","category":"form","tagline":"A download button whose arrow becomes a moving wave","description":"A download button whose arrow turns into a wavy line while the file downloads. Good for: download pages and file libraries. How it works: press it and the arrow becomes a line that waves while the file loads, and it bends into a check when done. It follows the real download. How to use: copy the files into your site and point the button at your file. No libraries needed.","priceCents":700,"sizeKb":14.3,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":9483,"likes":361,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:44.465Z","releases":[{"id":137,"version":"1.0.0","date":"2026-09-21","title":"First release","notes":"Thrum shipped as one file, with the reel recorded from the real page."}]},{"id":115,"slug":"tide","name":"Tide","kind":"component","category":"form","tagline":"A download button whose arrow lies down and becomes the file","description":"A download button drawn with one single line. Good for: download links for apps, files, PDFs or music. How it works: the arrow folds down flat and becomes a surface that ripples while the file downloads, then stands up as a check mark. How to use: copy the files into your page and point the button at your own file. No libraries needed.","priceCents":700,"sizeKb":15.8,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":7053,"likes":246,"relatedSlugs":["deck","pebble","signet"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:45.072Z","releases":[{"id":115,"version":"1.0.0","date":"2026-09-21","title":"First release","notes":"Tide shipped as one file, with the reel recorded from the real page."}]},{"id":69,"slug":"tube","name":"Tube","kind":"component","category":"form","tagline":"A Send button that shoots your message through a tube","description":"A Send button that delivers your message through an old style air tube. Good for: a contact form, a chat app or a feedback box. How it works: Press Send, your message rolls into a scroll, drops into a brass capsule, and a tube carries it to the other desk. How to use: Copy the files and connect the form to your email or message service. Uses GSAP for animation.","priceCents":700,"sizeKb":13.9,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":8191,"likes":322,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:46.924Z","releases":[{"id":69,"version":"1.0.0","date":"2026-07-14","title":"First release","notes":"Tube shipped as one file, with the reel recorded from the real page."}]},{"id":96,"slug":"tumbler","name":"Tumbler","kind":"component","category":"form","tagline":"A one-time code field that cuts a key","description":"A six-digit code field drawn as the inside of a door lock. Good for: two-step login and account checks. How it works: each digit cuts a notch into a key and the lock pins drop into place. When you submit, a line of light checks the pins one by one. How to use: copy the files into your page and connect the code to your own check. No libraries needed.","priceCents":700,"sizeKb":15.1,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":5580,"likes":238,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:47.532Z","releases":[{"id":96,"version":"1.0.0","date":"2026-08-02","title":"First release","notes":"Tumbler shipped as one file, with the reel recorded from the real page."}]},{"id":70,"slug":"upload","name":"Upload","kind":"component","category":"form","tagline":"A ready to use file upload box with progress bars","description":"A complete file upload box you can use on a real website. Good for: forms, profile pictures or document uploads. How it works: Drag files in, pick them or paste them, and each file is checked, shows an image preview and its own progress bar with cancel and retry. How to use: Copy the files into your site and send the uploads to your own server. No libraries needed.","priceCents":700,"sizeKb":13.9,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":4700,"likes":205,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:48.137Z","releases":[{"id":70,"version":"1.0.0","date":"2026-07-15","title":"First release","notes":"Upload shipped as one file, with the reel recorded from the real page."}]},{"id":83,"slug":"warden","name":"Warden","kind":"component","category":"form","tagline":"A password strength meter with a growing dragon","description":"A password field where a little creature grows as your password gets stronger. Good for: sign up pages or account settings. How it works: Type a password and a baby creature hatches and grows into a big dragon, and it shows how long the password would take to crack. How to use: Copy the files into your sign up page and connect the form to your account system. No libraries needed.","priceCents":500,"sizeKb":10,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.js","favicon.png","index.html","style.css"],"downloads":0,"views":7613,"likes":281,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:52.550Z","releases":[{"id":83,"version":"1.0.0","date":"2026-07-19","title":"First release","notes":"Warden shipped as one file, with the reel recorded from the real page."}]},{"id":48,"slug":"weather","name":"Weather","kind":"component","category":"animation","tagline":"A glass weather card that changes with each day","description":"A glass weather card with a forecast strip where each day shows its own weather. Good for: weather apps and travel sites. How it works: tap a day and the card changes to rain, sun, clouds, lightning or snow, with sound you can mute. How to use: copy the files into your page and connect the days to your own weather data. No libraries needed, just HTML, CSS and JavaScript.","priceCents":500,"sizeKb":9.6,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":4248,"likes":136,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:53.170Z","releases":[{"id":48,"version":"1.0.0","date":"2026-07-08","title":"First release","notes":"Weather shipped as one file, with the reel recorded from the real page."}]},{"id":5,"slug":"wish","name":"Wish","kind":"component","category":"animation","tagline":"A birthday cake whose candles you blow out with your breath","description":"A birthday cake with lit candles in a dark room. Good for: birthday greetings, party invites or a fun surprise page for a friend. How it works: allow the microphone and blow, and the flames bend and go out one by one. Without a microphone, press and hold a button instead. How to use: copy the files into your page and change the message. No libraries needed.","priceCents":700,"sizeKb":14.2,"deps":0,"stack":["vanilla","css","canvas"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":9060,"likes":413,"relatedSlugs":["aurelia","parachute","nova"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:54.495Z","releases":[{"id":5,"version":"1.0.0","date":"2026-07-29","title":"First release","notes":"Wish shipped as one file, with the reel recorded from the real page."}]},{"id":197,"slug":"accord","name":"Accord","kind":"template","category":"layout","tagline":"A client CRM with a drag-and-drop deal board","description":"An eight-page CRM app for a sales team to follow customers from first lead to won deal. Good for: an agency, a service company or a B2B sales team. How it works: drag a customer card from one stage to the next, with undo, and open any customer to see their deal, notes and tasks. Includes: customers board, customer profiles, dashboard with charts, tasks, activity, team, projects, settings, a sign-in screen, CSV export and a phone layout. How to use: it comes with sample data, so replace it with your own backend. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":12000,"sizeKb":155.5,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/activity-kinds.css","css/activity.css","css/customers.css","css/dashboard.css","css/projects.css","css/settings.css","css/signin.css","css/tasks-kit.css","css/tasks.css","css/team.css","css/ui.css","index.html","src/charts.ts","src/main.ts","src/motion.ts","src/pages/activity-kinds.ts","src/pages/activity.ts","src/pages/customers.ts","src/pages/dashboard-revenue.ts","src/pages/dashboard.ts","src/pages/projects.ts","src/pages/settings.ts","src/pages/signin.ts","src/pages/tasks-kit.ts","src/pages/tasks.ts","src/pages/team.ts","src/pages/types.ts","src/shell.ts","src/store.ts","src/ui.ts"],"downloads":0,"views":41203,"likes":1846,"relatedSlugs":["halden","rapport","sprig"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-23T17:08:21.933Z","releases":[{"id":238,"version":"1.0.0","date":"2026-10-16","title":"First release","notes":"Accord shipped, with the reel recorded from the real page."}]},{"id":233,"slug":"ambrel","name":"Ambrel","kind":"template","category":"layout","tagline":"A point of sale for a shop with members and a cash drawer","description":"A point of sale and back office for a shop that sells off the shelf, shown with sample data from a homewares store with two shops. Good for: homewares, gift, beauty and other retail shops that ring up sales at a counter, reward regular customers and count a cash drawer. How it works: you tap products onto a ticket, add a member to earn or spend points, and take payment, and the sale shows up straight away on the home screen, in receipts, in the cash drawer, in stock and on the member. Includes: a working register with a category list, product photos, a ticket with per-line discounts, discount codes and parked tickets, payment by card, cash with change, gift card or a split, a printed-style receipt with a PAID stamp, a home screen with sales by hour against last week, reports with a busy-hours chart, receipts with refunds by line and returns, a cash drawer you count note by note, bank deposits, the catalogue and stock with reorders, suppliers, members with tiers and points, closed-day reports and exports, staff roles and permissions, devices, an activity log, settings with a live receipt preview, help, a PIN lock screen, a sidebar that folds into a slim icon bar, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data saved in the browser with no backend, so connect your own data, payments and server. Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":169,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/archive.css","css/catalogue.css","css/customers.css","css/help.css","css/insights.css","css/payouts.css","css/receipts.css","css/register.css","css/security.css","css/settings.css","css/today.css","index.html","src/App.tsx","src/actions.tsx","src/env.d.ts","src/finder.tsx","src/main.tsx","src/motion.ts","src/pages/archive.tsx","src/pages/catalogue.tsx","src/pages/customers.tsx","src/pages/help.tsx","src/pages/insights.tsx","src/pages/payouts.tsx","src/pages/receipts.tsx","src/pages/register-pay.tsx","src/pages/register.tsx","src/pages/security.tsx","src/pages/settings.tsx","src/pages/today.tsx","src/pages/types.ts","src/router.ts","src/store.ts","src/ui/charts.tsx","src/ui/format.ts","src/ui/icons.tsx","src/ui/kit.tsx","src/ui/overlay.tsx","tsconfig.json"],"downloads":0,"views":90,"likes":2,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T08:28:52.094Z","releases":[{"id":296,"version":"1.0.0","date":"2026-10-25","title":"First release","notes":"Ambrel shipped, with the reel recorded from the real page."}]},{"id":188,"slug":"arden","name":"Arden","kind":"template","category":"layout","tagline":"A real-estate agency landing page with property search","description":"A one-page website for a real-estate agency. Good for: an estate agent, a property developer or a property investment company. How it works: a hero film opens to full screen as you scroll, and visitors search homes to buy or rent with filters for price, size and bedrooms. Includes: property search, a how it works section, an agents row, investment offers with brochures, a booking form and a phone layout. How to use: swap in your own listings and photos in src/data.ts and connect the booking form to your own form service, since there is no backend. Built with TypeScript, HTML and CSS plus GSAP and Lenis.","priceCents":10000,"sizeKb":23.8,"deps":2,"stack":["vanilla","css","svg","gsap","lenis"],"install":"","files":["app.css","index.html","src/data.ts","src/main.ts","src/rec.ts","tsconfig.json"],"downloads":0,"views":32015,"likes":1067,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T13:21:17.407Z","releases":[{"id":223,"version":"1.0.0","date":"2026-10-14","title":"First release","notes":"Arden shipped, with the reel recorded from the real page."}]},{"id":7,"slug":"bamboo","name":"Bamboo","kind":"template","category":"form","tagline":"A sign-in page where a panda covers his eyes","description":"A sign-in page that starts dark, with a sleeping panda and a hanging lamp. Good for: a fun login screen for an app, a game or a kids or animal brand. How it works: pull the lamp cord and the room lights up, the panda wakes and the sign-in form rises. When you type your password he covers his eyes, and he only peeks when you tap show password. How to use: copy the files into your site and connect the form to your own login system. No libraries needed.","priceCents":2000,"sizeKb":16.8,"deps":0,"stack":["vanilla","css"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":51543,"likes":1868,"relatedSlugs":["sigil","mochi","quarto"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:09.538Z","releases":[{"id":7,"version":"1.0.0","date":"2026-07-30","title":"First release","notes":"Bamboo shipped as one file, with the reel recorded from the real page."}]},{"id":31,"slug":"birthday","name":"Birthday","kind":"template","category":"animation","tagline":"An animated birthday greeting that ends in a heart of flowers","description":"An animated birthday page that plays like a short film in four parts. Good for: a birthday surprise for a partner, friend or family member that you send as a link. How it works: tap a beating heart to open it, then colour fills the screen, a birthday wish appears and a tree blooms into a heart of petals. How to use: change the name and message in the HTML and share the page, it uses GSAP for animation.","priceCents":2000,"sizeKb":18.2,"deps":1,"stack":["vanilla","css","canvas","svg","gsap"],"install":"","files":["birthday.css","birthday.js","index.html"],"downloads":0,"views":47901,"likes":2209,"relatedSlugs":["love-letter","deadline","heartcode"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:10.762Z","releases":[{"id":31,"version":"1.0.0","date":"2026-08-13","title":"First release","notes":"Birthday shipped as one file, with the reel recorded from the real page."}]},{"id":206,"slug":"cadra","name":"Cadra","kind":"template","category":"layout","tagline":"A factory management app with a drag-and-drop production plan","description":"A business app for a small factory, with 29 pages for production, sales, stock and money. Good for: manufacturers, workshops and anyone building software for a small factory. How it works: drag a job to a new day on the timeline chart and the steps after it move too. Includes: work orders, sales, a shop till, purchasing, stock in three warehouses, shipments, payroll, invoices, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":301.8,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/accounting.css","css/contacts.css","css/dashboard.css","css/hr.css","css/inventory.css","css/logistics.css","css/manufacturing.css","css/pos.css","css/purchasing.css","css/reporting.css","css/sales.css","css/settings.css","css/support.css","index.html","src/actions.ts","src/charts.ts","src/gantt.ts","src/main.ts","src/motion.ts","src/nav.ts","src/pages/accounting.ts","src/pages/contacts.ts","src/pages/dashboard.ts","src/pages/hr.ts","src/pages/inventory.ts","src/pages/logistics.ts","src/pages/manufacturing.ts","src/pages/pos.ts","src/pages/purchasing.ts","src/pages/reporting.ts","src/pages/sales.ts","src/pages/settings.ts","src/pages/support.ts","src/pages/types.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":2010,"likes":10,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-22T10:26:27.322Z","releases":[{"id":283,"version":"1.0.1","date":"2026-10-21","title":"A new look, five accent colours","notes":"A floating dock, the main sections as tabs across the top with a sliding pill and a glass row of sub-pages for Sales and Stock, frosted cards on a neutral background with a solid tile for each key figure, and an Ocean accent by default with Mono (black and white), Sage, Coral and Amber in Settings, each in light and dark. Tabs become a scrolling strip and the dock a bottom bar on tablets and phones."},{"id":254,"version":"1.0.0","date":"2026-10-19","title":"First release","notes":"Cadra shipped, with the reel recorded from the real page."}]},{"id":168,"slug":"camber","name":"Camber","kind":"template","category":"layout","tagline":"A car parts shop landing page with animated sections","description":"A one-page landing page for a shop that sells car and bike parts. Good for: an auto parts store, a tyre and wheel shop or any online shop with a big catalogue. How it works: sections slide in as you scroll, product rows show trending wheels and spares, and adding a part makes its picture fly into the bag. Includes: a search box, brand logos, a parts catalogue, blog cards, short looping films and a full footer. How to use: swap in your own photos, products and text, then connect the search and the bag to your shop. Uses GSAP and Lenis for animation and smooth scrolling.","priceCents":7000,"sizeKb":27.5,"deps":2,"stack":["vanilla","css","svg","gsap","lenis"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":44462,"likes":1506,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:13.209Z","releases":[{"id":222,"version":"1.1.0","date":"2026-10-14","title":"A scroll-scrubbed film","notes":"A film under the hero that scrolling plays frame by frame, forwards and back: 192 stills drawn to a canvas. A focus frame tracks the brake caliper, widens to the wheel and opens out to the whole car across three chapters, with counted stats, letter-flip titles and chapter tabs. Phones load half the frames and pan the crop to keep the part in view; reduced motion shows the final frame with all three chapters."},{"id":179,"version":"1.0.0","date":"2026-10-06","title":"First release","notes":"Camber shipped as one file, with the reel recorded from the real page."}]},{"id":42,"slug":"caveman","name":"Caveman","kind":"template","category":"layout","tagline":"A 404 page with an astronaut floating in space","description":"A 404 page not found page with an astronaut floating inside a glowing ring that forms the zero. Good for: the error page of any website or app. How it works: stars twinkle, a planet drifts and a shooting star passes by while the astronaut floats. With a mouse, the scene moves gently as you move the cursor. A Take me home button sends people back to your home page. How to use: copy the files into your site and set the button link. No libraries needed.","priceCents":1500,"sizeKb":5.1,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["index.html","record5.html","script.js","style.css"],"downloads":0,"views":49524,"likes":1848,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:15.056Z","releases":[{"id":42,"version":"1.0.0","date":"2026-07-08","title":"First release","notes":"Caveman shipped as one file, with the reel recorded from the real page."}]},{"id":185,"slug":"coffer","name":"Coffer","kind":"template","category":"layout","tagline":"An eight-page invoicing and accounting dashboard","description":"A front-end dashboard for invoicing and accounting, made for freelancers and small studios. Good for: starting an invoicing, billing or finance app without building the screens yourself. How it works: you can create an invoice in a live editor, see it marked paid with a stamp, and track cash flow, payments and expenses. Includes: overview, invoices, invoice editor, single invoice, expenses, clients, reports for profit and loss, tax and late payments, settings, and light and dark mode. How to use: it runs on sample data, so connect your own backend, it uses GSAP for animation.","priceCents":9000,"sizeKb":67,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","index.html","src/charts.ts","src/main.ts","src/model.ts","src/motion.ts","src/pages/clients.ts","src/pages/editor.ts","src/pages/expenses.ts","src/pages/invoice.ts","src/pages/invoices.ts","src/pages/overview.ts","src/pages/reports.ts","src/pages/settings.ts","src/parts.ts","src/route.ts","src/ui.ts","tsconfig.json","views.css"],"downloads":0,"views":41627,"likes":1858,"relatedSlugs":["fernly","wharf","halden"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:15.662Z","releases":[{"id":215,"version":"1.0.1","date":"2026-10-13","title":"Fits phones and tablets","notes":"44px touch targets, no text under 12px, report tables that stack into labelled rows, an invoice list that drops secondary columns instead of scrolling sideways, a header that fits 320px screens, and chart labels that never overlap."},{"id":214,"version":"1.0.0","date":"2026-10-13","title":"First release","notes":"Coffer shipped, with the reel recorded from the real page."}]},{"id":239,"slug":"coffra","name":"Coffra","kind":"template","category":"layout","tagline":"A finance and people back office with a morphing cash-flow chart","description":"A back office for a business with several locations, shown with sample data from a group of climbing gyms. Good for: owners, office managers and bookkeepers who look after money, payroll, staff and contracts in one place. How it works: the overview opens on money in and out by month, and switching the range or the location reshapes the chart, while a month-end checklist ticks itself off as you file transactions, match the bank and approve the pay run on other pages. Includes: cash across four bank accounts, transactions you file with one click on a suggested category, company cards you can freeze or give a limit, budgets with a forecast, failed membership payments to retry, transfers between accounts, bank matching, a pay run you approve, a timesheet grid you edit, time off requests, a staff directory, onboarding checklists, contracts with a renewals timeline, an inbox, a week calendar you drag events across, settings, help, search with ⌘K, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend and the suggested categories are part of that sample data, so add your own data and server. Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":137.6,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/accounts.css","css/agreements.css","css/calendar.css","css/help.css","css/inbox.css","css/money.css","css/overview.css","css/payroll.css","css/settings.css","css/team.css","index.html","src/App.tsx","src/actions.tsx","src/env.d.ts","src/finder.tsx","src/main.tsx","src/motion.ts","src/pages/accounts.tsx","src/pages/agreements.tsx","src/pages/calendar.tsx","src/pages/help.tsx","src/pages/inbox.tsx","src/pages/money.tsx","src/pages/overview.tsx","src/pages/payroll.tsx","src/pages/settings.tsx","src/pages/team.tsx","src/pages/types.ts","src/router.ts","src/store.ts","src/ui/charts.tsx","src/ui/format.ts","src/ui/icons.tsx","src/ui/kit.tsx","src/ui/overlay.tsx","tsconfig.json"],"downloads":0,"views":724,"likes":4,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T16:08:02.216Z","releases":[{"id":302,"version":"1.0.0","date":"2026-10-26","title":"First release","notes":"Coffra shipped, with the reel recorded from the real page."}]},{"id":200,"slug":"corbel","name":"Corbel","kind":"template","category":"layout","tagline":"A sales dashboard for shops that sell online and in store","description":"A thirteen-page dashboard for a shop that sells both online and in its own stores. Good for: a retail brand, a home goods shop or an online store builder. How it works: the dashboard builds itself on load, tabs switch every chart between all sales, online and in store, and a colour setting turns the whole app from black and white to Pastel, Ocean or Sage, in light or dark. Includes: dashboard, products, orders, customers, messages, email, automations, analytics, integrations, project boards, help, feedback, settings, CSV export and a phone and tablet layout. How to use: it comes with sample data, so replace it with your own backend. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":12500,"sizeKb":210.1,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/analytics.css","css/automations.css","css/customers.css","css/dashboard.css","css/email.css","css/feedback.css","css/help.css","css/integrations.css","css/messages.css","css/orders.css","css/products.css","css/settings.css","css/workspace.css","index.html","src/main.ts","src/motion.ts","src/pages/analytics.ts","src/pages/automations.ts","src/pages/customers.ts","src/pages/dashboard.ts","src/pages/email.ts","src/pages/feedback.ts","src/pages/help.ts","src/pages/integrations.ts","src/pages/messages.ts","src/pages/orders.ts","src/pages/products.ts","src/pages/settings.ts","src/pages/types.ts","src/pages/workspace.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":2991,"likes":10,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-23T15:16:37.983Z","releases":[{"id":280,"version":"1.0.1","date":"2026-10-21","title":"A new look, four colour palettes","notes":"A floating dock, the main pages as tabs across the top with grouped sub-pages, frosted cards with a solid tile for each key figure, and black and white by default with Pastel, Ocean and Sage palettes in Settings, each in light and dark. Tabs become a scrolling strip and the dock a bottom bar on tablets and phones."},{"id":245,"version":"1.0.0","date":"2026-10-18","title":"First release","notes":"Corbel shipped, with the reel recorded from the real page."}]},{"id":234,"slug":"corvane","name":"Corvane","kind":"template","category":"layout","tagline":"A payments operations dashboard for card processors and fintech teams","description":"A back-office dashboard for a company that takes card and bank payments for other businesses, shown with sample data from a small card processor. Good for: payments, risk and support teams, fintech founders and agencies building a processor's or marketplace's admin panel. How it works: the home screen shows money taken today against yesterday, a 30-day chart, what needs a person (held payments, disputes, new merchants, returned payouts) and a live payments feed, and the risk page lets you drag two thresholds across last month's risk scores to see how much fraud you would stop and how many good customers you would block before you apply them. Includes: a payments table with filters, CSV export, refunds and a timeline for each payment, a review queue to approve or block held payments with undo, a disputes board with evidence checklists and deadlines, payouts with instant payout and retry, merchant onboarding with identity and sanctions checks, reports, API keys that only show after you re-enter your password, webhooks with test sends, a request log, an audit log of every action, team roles, two-step sign-in, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data saved in the browser with no backend, so connect it to your own payments API and data. Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":114.2,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/audit.css","css/developers.css","css/disputes.css","css/help.css","css/merchants.css","css/overview.css","css/payments.css","css/payouts.css","css/reports.css","css/risk.css","css/settings.css","index.html","src/App.tsx","src/actions.ts","src/data.ts","src/drawers.tsx","src/forms.tsx","src/main.tsx","src/money.ts","src/motion.ts","src/pages/audit.tsx","src/pages/developers.tsx","src/pages/disputes.tsx","src/pages/help.tsx","src/pages/merchants.tsx","src/pages/overview.tsx","src/pages/payments.tsx","src/pages/payouts.tsx","src/pages/reports.tsx","src/pages/risk.tsx","src/pages/settings.tsx","src/routes.ts","src/store.ts","src/ui/charts.tsx","src/ui/icons.tsx","src/ui/kit.tsx","tsconfig.json"],"downloads":0,"views":215,"likes":1,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T10:13:54.065Z","releases":[{"id":297,"version":"1.0.0","date":"2026-10-26","title":"First release","notes":"Corvane shipped, with the reel recorded from the real page."}]},{"id":147,"slug":"coterie","name":"Coterie","kind":"template","category":"layout","tagline":"A people and payroll dashboard for HR teams","description":"A three-screen dashboard for managing staff, work hours and pay. Good for: HR tools, team apps and internal company dashboards. How it works: switch between Overview, People and Payroll, track hours with a working timer, tick off onboarding tasks, search the team and invite new people. Includes: an hours chart, a week calendar, a benefits list, payroll per person and downloadable PDF payslips, in a light theme for desktop, tablet and phone. How to use: replace the sample data in app.js with your own data or backend. Built with plain HTML, CSS and JavaScript, and uses GSAP for animation.","priceCents":9000,"sizeKb":23.7,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":44432,"likes":2326,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:17.522Z","releases":[{"id":212,"version":"1.0.1","date":"2026-10-10","title":"Version 1.0.1","notes":"Settings, invites and documents now work: a settings dialog (greeting name, working day), an invite form that adds people as Invited, and real PDF contracts and payslips."},{"id":200,"version":"1.0.0","date":"2026-09-30","title":"First release","notes":"First release: three screens (Overview, People, Payroll) with a working time tracker, onboarding checklist, week calendar and sample team data."}]},{"id":243,"slug":"covry","name":"Covry","kind":"template","category":"layout","tagline":"A money and people back office with a cash chart you can filter by site","description":"A back office for a business with a few locations, shown with sample data from a group of veterinary clinics. Good for: owners, practice or office managers and bookkeepers who look after cash, bills, payroll, staff and contracts in one place. How it works: the overview shows money in above a line and spending below it, month by month or week by week, and the columns reshape when you filter to one location; card payments that no rule could place wait in a stack, and you file the top one with one tap or tick “always” so every payment from that merchant sorts itself. Includes: transactions with filters and CSV export, company cards you can freeze or give a monthly limit, bills you pay or schedule, invoices you send, remind and mark paid with a paid stamp, four bank accounts with transfers, budgets against spend, sorting rules, tax filings you file and pay, a pay run you review and approve, timesheets, time off, shift timelines per location, a staff directory, a hiring board you drag candidates across, contracts you sign on a drawn signature pad, renewals, templates, a calendar, a report builder that saves and exports, a new-location checklist, settings, help, search with ⌘K, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data kept in the browser with no backend, and the suggested categories come from that sample data, so add your own data and server. Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":163.2,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/accounts.css","css/calendar.css","css/contracts.css","css/help.css","css/launch.css","css/money.css","css/overview.css","css/payroll.css","css/people.css","css/reports.css","css/settings.css","index.html","src/App.tsx","src/actions.tsx","src/env.d.ts","src/finder.tsx","src/main.tsx","src/motion.ts","src/pages/accounts.tsx","src/pages/calendar.tsx","src/pages/contracts.tsx","src/pages/help.tsx","src/pages/launch.tsx","src/pages/money.tsx","src/pages/overview.tsx","src/pages/payroll.tsx","src/pages/people.tsx","src/pages/reports.tsx","src/pages/settings.tsx","src/pages/types.ts","src/router.ts","src/store.ts","src/ui/charts.tsx","src/ui/format.ts","src/ui/icons.tsx","src/ui/kit.tsx","src/ui/overlay.tsx","tsconfig.json"],"downloads":0,"views":130,"likes":0,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T17:03:24.776Z","releases":[{"id":306,"version":"1.0.0","date":"2026-10-26","title":"First release","notes":"Covry shipped, with the reel recorded from the real page."}]},{"id":86,"slug":"date","name":"Date","kind":"template","category":"animation","tagline":"A cute video call where two friends blow kisses","description":"A cute animated scene of two little characters on a video call. Good for: a love message, a long distance gift, Valentine's Day or an anniversary surprise. How it works: Tap to blow a kiss that bounces across to the other side. The other one catches it and blows one back, and a heart fills up until it bursts into confetti. How to use: Copy the files into a page, change the names or text, and share the link. No libraries needed.","priceCents":1500,"sizeKb":9.8,"deps":0,"stack":["vanilla","css","canvas","svg"],"install":"","files":["app.js","index.html","style.css"],"downloads":0,"views":44612,"likes":1677,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:19.977Z","releases":[{"id":86,"version":"1.0.0","date":"2026-07-23","title":"First release","notes":"Date shipped as one file, with the reel recorded from the real page."}]},{"id":32,"slug":"deadline","name":"Deadline","kind":"template","category":"animation","tagline":"A funny coding animation with a deadline chasing a developer","description":"A funny animated scene where a red deadline monster moves toward a developer who is typing as fast as he can. Good for: a developer portfolio, a blog header or a fun post for social media. How it works: a real countdown timer runs down while the code on screen lights up line by line as it runs. How to use: open the page or change the timer and code text to your own. Built with HTML, CSS and JavaScript, using GSAP for animation.","priceCents":1500,"sizeKb":8.5,"deps":1,"stack":["vanilla","css","gsap"],"install":"","files":["deadline.css","deadline.js","index.html"],"downloads":0,"views":17472,"likes":776,"relatedSlugs":["love-letter","birthday","heartcode"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:20.583Z","releases":[{"id":168,"version":"1.0.1","date":"2026-10-04","title":"Fits phones","notes":"No sideways scrolling, code at a readable size that scrolls inside its panel, and full-size touch targets for the slider and buttons. Desktop looks the same."},{"id":32,"version":"1.0.0","date":"2026-06-25","title":"First release","notes":"Deadline shipped as one file, with the reel recorded from the real page."}]},{"id":45,"slug":"den","name":"Den","kind":"template","category":"form","tagline":"A sign-in page where a husky puppy covers his eyes","description":"A sign-in page guarded by a cute husky puppy. Good for: a friendly login screen for an app, a pet brand or a kids product. How it works: the puppy covers his eyes as soon as you start typing your password, and only peeks when you tap show password. How to use: copy the files into your site and connect the form to your own login system. No libraries needed.","priceCents":1500,"sizeKb":7.8,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["README.md","app.js","favicon.png","index.html","style.css"],"downloads":0,"views":22037,"likes":760,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:50:56.408Z","releases":[{"id":45,"version":"1.0.0","date":"2026-07-10","title":"First release","notes":"Den shipped as one file, with the reel recorded from the real page."}]},{"id":189,"slug":"dwella","name":"Dwella","kind":"template","category":"layout","tagline":"A homebuying landing page with a cash-back calculator","description":"A one-page website for a homebuying, real-estate or mortgage brand. Good for: showing home buyers how much money they can save and the homes they can buy. How it works: a house film plays in the hero, sections fill in as you scroll, and the calculator updates the total as you move the price slider. Includes: a how it works section, offers, a calculator, a homes carousel with saved homes, a map section, reviews, FAQ and a phone layout. How to use: swap in your own homes, text and photos, and set your rates in src/widgets.ts, since there is no backend. Built with TypeScript, HTML and CSS plus GSAP and Lenis.","priceCents":8000,"sizeKb":21.1,"deps":2,"stack":["vanilla","css","svg","gsap","lenis"],"install":"","files":["app.css","index.html","src/heroTrack.ts","src/main.ts","src/rec.ts","src/widgets.ts","tsconfig.json"],"downloads":0,"views":40754,"likes":1753,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:25.456Z","releases":[{"id":224,"version":"1.0.0","date":"2026-10-14","title":"First release","notes":"Dwella shipped, with the reel recorded from the real page."}]},{"id":164,"slug":"fathom","name":"Fathom","kind":"template","category":"layout","tagline":"A dark crypto trading dashboard with live prices","description":"A dark trading dashboard for a crypto exchange with eight pages. Good for: crypto exchanges, trading apps and fintech products. How it works: prices, the chart and the order book update live, and you can place and cancel buy and sell orders and set price alerts. Includes: Markets, Portfolio, Orders, Wallets, Alerts, Activity, Settings and Help, three currencies and four accent colours, on desktop, tablet and phone. How to use: replace the sample data in js/data.js with a real price feed, since there is no backend. Built with plain HTML, CSS and JavaScript, and uses GSAP for animation.","priceCents":6000,"sizeKb":68,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","app.js","index.html","js/activity.js","js/alerts.js","js/charts.js","js/data.js","js/help.js","js/markets.js","js/motion.js","js/orders.js","js/portfolio.js","js/prefs.js","js/settings.js","js/ui.js","js/wallets.js","views.css"],"downloads":0,"views":49666,"likes":2233,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:26.739Z","releases":[{"id":204,"version":"1.0.0","date":"2026-10-06","title":"First release","notes":"First release: eight pages — Markets terminal, Portfolio, Orders, Wallets, Alerts, Activity, Settings and Help."},{"id":177,"version":"1.0.3","date":"2026-10-06","title":"Candles grow in place","notes":"Each candle scales about its own body centre, so nothing slides up or down while a chart appears or re-cuts."},{"id":176,"version":"1.0.2","date":"2026-10-06","title":"Live ticks glide","notes":"The liquidity map slides its new column in, the last-price tag and line move to the new level, axis labels fade when they step aside for a tag, and a price that leaves the chart's range cross-fades onto the re-scaled chart instead of re-laying out in one frame."},{"id":174,"version":"1.0.1","date":"2026-10-06","title":"Smooth switches","notes":"Switching a pair, a range or the chart type is smooth: the chart, the volume strip and the depth strip fold and regrow together instead of cutting, the chart type cross-fades, and the header price lands on the new token instead of counting through the old one."}]},{"id":161,"slug":"fernly","name":"Fernly","kind":"template","category":"layout","tagline":"A seven-page project management dashboard","description":"A project management dashboard with seven working pages. Good for: team workspaces, SaaS products, agencies and client portals. How it works: drag tasks between columns, track time, check the calendar, change the chart range on Analytics and open team profiles in a side panel. Includes: Dashboard, Tasks, Calendar, Analytics, Team, Settings and Help, CSV import and export, four accent colours and keyboard shortcuts, in a light theme for desktop, tablet and phone. How to use: replace the sample data in js/data.js with your own data or backend. Built with plain HTML, CSS and JavaScript, and uses GSAP.","priceCents":10000,"sizeKb":51.5,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","app.js","index.html","js/analytics.js","js/calendar.js","js/dashboard.js","js/data.js","js/help.js","js/motion.js","js/settings.js","js/tasks.js","js/team.js","js/ui.js","views.css"],"downloads":0,"views":27003,"likes":1197,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:27.343Z","releases":[{"id":199,"version":"1.0.0","date":"2026-10-03","title":"First release","notes":"First release: seven pages (Dashboard, Tasks, Calendar, Analytics, Team, Settings, Help center) with a drag-and-drop task board and sample data."}]},{"id":84,"slug":"flow","name":"Flow","kind":"template","category":"form","tagline":"A liquid sign-in page that ripples as you type","description":"A sign-in page with a soft liquid look. Good for: a login screen for an app, a startup or a creative brand. How it works: a glowing drop of light follows your cursor and every key you press sends a ripple across the page. When you sign in, the button melts into a checkmark. How to use: copy the files into your site and connect the form to your own login system. No libraries needed.","priceCents":1500,"sizeKb":8.4,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.js","favicon.png","index.html","style.css"],"downloads":0,"views":14450,"likes":662,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:27.951Z","releases":[{"id":84,"version":"1.0.0","date":"2026-07-19","title":"First release","notes":"Flow shipped as one file, with the reel recorded from the real page."}]},{"id":227,"slug":"folka","name":"Folka","kind":"template","category":"layout","tagline":"A staff, shifts and pay app for cafés and shift teams","description":"An app for running staff, shifts, time off and pay for a business with several sites. Good for: cafés, restaurants, shops and other businesses that work in shifts. How it works: the home screen shows who is in today and what needs you, and you approve time off with one tap. Includes: a drag-and-drop shift plan that warns when a site is short, staff profiles with photos, an org chart, attendance and timesheets, time off with a team calendar, monthly payroll with payslips, hiring, reviews and goals, reports, search that can also approve requests and add shifts, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":290.4,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/help.css","css/hiring.css","css/leave.css","css/overview.css","css/payroll.css","css/people.css","css/performance.css","css/reports.css","css/settings.css","css/time.css","index.html","src/actions.ts","src/charts.ts","src/drag.ts","src/env.d.ts","src/main.ts","src/motion.ts","src/pages/help.ts","src/pages/hiring.ts","src/pages/leave.ts","src/pages/overview.ts","src/pages/payroll.ts","src/pages/people.ts","src/pages/performance.ts","src/pages/reports.ts","src/pages/settings.ts","src/pages/time.ts","src/pages/types.ts","src/photos.ts","src/rota.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":631,"likes":4,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-22T18:44:17.264Z","releases":[{"id":291,"version":"1.0.1","date":"2026-10-23","title":"Instant page switching","notes":"Switching pages from the top tabs is instant: the new page appears as soon as you click, with no pause while the old one fades, and every page is loaded in the background once the app is idle, so a first visit never waits."},{"id":288,"version":"1.0.0","date":"2026-10-22","title":"First release","notes":"Folka shipped, with the reel recorded from the real page."}]},{"id":190,"slug":"gesso","name":"Gesso","kind":"template","category":"layout","tagline":"An art marketplace landing page with cards that fan out","description":"A one-page website for an art marketplace, gallery or creative platform. Good for: a site where artists sell their work and collectors buy it. How it works: a wall of art cards fans out on load, and as you scroll the cards deal into stacks, fold into grids and grow into film banners. Includes: a marketplace section, a studio film, a works carousel, member avatars, pricing cards, a footer and a phone layout. How to use: swap in your own images listed in src/art.ts and edit the text in index.html, since there is no backend. Built with TypeScript, HTML and CSS plus GSAP and Lenis.","priceCents":9900,"sizeKb":15,"deps":2,"stack":["vanilla","css","svg","gsap","lenis"],"install":"","files":["app.css","index.html","src/art.ts","src/main.ts","tsconfig.json"],"downloads":0,"views":54471,"likes":2186,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:28.559Z","releases":[{"id":226,"version":"1.0.1","date":"2026-10-15","title":"Fits phones and tablets","notes":"One even spacing between sections that scales with the screen width, so phones no longer show tall blank gaps, tighter spacing inside sections, and pricing cards that stack full width on small phones so every price and note reads."},{"id":225,"version":"1.0.0","date":"2026-10-15","title":"First release","notes":"Gesso shipped, with the reel recorded from the real page."}]},{"id":222,"slug":"grista","name":"Grista","kind":"template","category":"layout","tagline":"A business bank app for a small shop or bakery","description":"A business banking and spending app for a small business with a few shops. Good for: bakeries, cafes, small shops and fintech app makers. How it works: a chart shows your cash day by day, you drag a strip to look back through the year and move sliders to test a cash forecast. Includes: 11 pages with team cards you can lock, bills, budgets, statements, reports, search, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data saved in the browser with no backend, so connect your own bank or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":167.1,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/analytics.css","css/bills.css","css/budgets.css","css/cards.css","css/overview.css","css/payments.css","css/settings.css","css/statements.css","css/support.css","css/team.css","css/transactions.css","index.html","src/actions.ts","src/bankcard.ts","src/charts.ts","src/env.d.ts","src/flow.ts","src/main.ts","src/motion.ts","src/pages/analytics.ts","src/pages/bills.ts","src/pages/budgets.ts","src/pages/cards.ts","src/pages/overview.ts","src/pages/payments.ts","src/pages/settings.ts","src/pages/statements.ts","src/pages/support.ts","src/pages/team.ts","src/pages/transactions.ts","src/pages/types.ts","src/store.ts","src/txdrawer.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":277,"likes":2,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:30.981Z","releases":[{"id":272,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Grista shipped, with the reel recorded from the real page."}]},{"id":57,"slug":"gungame","name":"Gungame","kind":"template","category":"animation","tagline":"A neon shooting game you play with your mouse","description":"A small neon shooting game that runs in the browser. Good for: a fun extra on a portfolio, a game site or a party page. How it works: Your mouse is the aim, and a click or the Space key fires with a flash and flying shells. Hit the glowing targets to build your combo. Includes: Score, accuracy, combo counter, ammo and levels. How to use: Open the page to play, or add it to your site and change the colours and text. No libraries needed.","priceCents":1800,"sizeKb":15,"deps":0,"stack":["vanilla","css","canvas","svg"],"install":"","files":[".gitignore","README.md","index.html","script.js","style.css"],"downloads":0,"views":45704,"likes":1930,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:50:57.340Z","releases":[{"id":57,"version":"1.0.0","date":"2026-07-12","title":"First release","notes":"Gungame shipped as one file, with the reel recorded from the real page."}]},{"id":179,"slug":"halden","name":"Halden","kind":"template","category":"layout","tagline":"A six-page sales CRM with a drag-and-drop deal board","description":"A front-end sales CRM app for teams that need a working pipeline to build on. Good for: starting a CRM, sales tracker or client management tool. How it works: drag a deal from one stage to the next and the totals and dashboard numbers update right away. Click a contact to open their profile. Includes: dashboard, pipeline board, contacts, activities, reports with charts, settings, light and dark mode, four accent colours and a phone layout. How to use: it runs on sample data with no backend, so connect your own, it uses GSAP for animation.","priceCents":9000,"sizeKb":55.1,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","app.js","index.html","js/activities.js","js/contacts.js","js/dashboard.js","js/data.js","js/motion.js","js/pipeline.js","js/reports.js","js/settings.js","js/ui.js","views.css"],"downloads":0,"views":44201,"likes":2099,"relatedSlugs":["fernly","kestrel","coterie"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:33.502Z","releases":[{"id":191,"version":"1.0.0","date":"2026-10-09","title":"First release","notes":"Six pages — dashboard, pipeline, contacts, activities, reports and settings — in light and dark, with the reel recorded from the real page."}]},{"id":33,"slug":"heartcode","name":"Heartcode","kind":"template","category":"animation","tagline":"A 3D heart made of the words i love you","description":"A 3D heart built from many lines of the words i love you. Good for: a love message, an anniversary or Valentine's Day page, or a short video for social media. How it works: the heart sways, beats like a real heart and shimmers line by line. Move your mouse over it and it turns toward you. How to use: change the words in the JavaScript file and open the page. No libraries needed.","priceCents":1500,"sizeKb":5.5,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["heart.css","heart.js","index.html"],"downloads":0,"views":51293,"likes":1900,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:34.727Z","releases":[{"id":33,"version":"1.0.0","date":"2026-06-26","title":"First release","notes":"Heartcode shipped as one file, with the reel recorded from the real page."}]},{"id":201,"slug":"hearth","name":"Hearth","kind":"template","category":"layout","tagline":"A mortgage CRM for loan officers","description":"A twelve-page CRM app for a mortgage loan officer to manage leads, loan files and documents. Good for: a mortgage broker, a lender or a loan team. How it works: turn a lead into a loan file, collect and approve the borrower's documents, and move the loan stage by stage to funded. Includes: dashboard, leads, applications, documents, tasks, calendar, pipeline, analytics, reports, settings, integrations, help and a phone layout. How to use: it comes with sample data, so replace it with your own backend. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":11000,"sizeKb":226.8,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/analytics.css","css/applications.css","css/calendar.css","css/dashboard.css","css/documents.css","css/help.css","css/integrations.css","css/leads.css","css/pipeline.css","css/reports.css","css/settings.css","css/tasks.css","index.html","src/actions.ts","src/charts.ts","src/main.ts","src/motion.ts","src/pages/analytics.ts","src/pages/applications.ts","src/pages/calendar.ts","src/pages/dashboard.ts","src/pages/documents.ts","src/pages/help.ts","src/pages/integrations.ts","src/pages/leads.ts","src/pages/pipeline.ts","src/pages/reports.ts","src/pages/settings.ts","src/pages/tasks.ts","src/pages/types.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":433,"likes":0,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-22T11:29:16.858Z","releases":[{"id":246,"version":"1.0.0","date":"2026-10-18","title":"First release","notes":"Hearth shipped, with the reel recorded from the real page."}]},{"id":14,"slug":"huddle","name":"Huddle","kind":"template","category":"form","tagline":"A sign-in form with shapes that watch you type","description":"A sign-in page with a group of friendly shapes next to the form. Good for: login pages for apps and creative brands. How it works: the shapes follow your mouse and watch you type your email. They look away for the password and turn their backs when you show it. How to use: copy the files into your site and connect the form to your own login. No libraries needed.","priceCents":1500,"sizeKb":12.2,"deps":0,"stack":["vanilla","css"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":34715,"likes":1307,"relatedSlugs":["sigil","bamboo","mochi"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:36.575Z","releases":[{"id":14,"version":"1.0.0","date":"2026-08-06","title":"First release","notes":"Huddle shipped as one file, with the reel recorded from the real page."}]},{"id":80,"slug":"intro","name":"Intro","kind":"template","category":"animation","tagline":"An animated text intro for a web studio or freelancer","description":"A short animated intro that plays big moving text in the browser like a video. Good for: a freelancer or studio home page, a portfolio opening or a short promo clip. How it works: Words and shapes move in one after another and end on a closing card with a call to contact you. How to use: Replace the name, words and email address with your own. Uses GSAP for the animation.","priceCents":1800,"sizeKb":15,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":31102,"likes":1192,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:37.182Z","releases":[{"id":80,"version":"1.0.0","date":"2026-07-19","title":"First release","notes":"Intro shipped as one file, with the reel recorded from the real page."}]},{"id":205,"slug":"ivora","name":"Ivora","kind":"template","category":"layout","tagline":"A practice app for a dental clinic","description":"An app for running a dental clinic, from today's patients to bills and supplies. Good for: dental clinics, small medical practices and health software makers. How it works: you see every chair live, click teeth on a tooth chart to record work and drag bookings between times and chairs. Includes: 15 pages with patients, treatment plans, records, prescriptions, lab work, messages, tasks, billing and insurance, supplies, reports, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":303.3,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/assist.css","css/billing.css","css/help.css","css/insights.css","css/labs.css","css/messages.css","css/patients.css","css/plans.css","css/records.css","css/schedule.css","css/scripts.css","css/settings.css","css/supplies.css","css/tasks.css","css/today.css","index.html","src/actions.ts","src/charts.ts","src/drag.ts","src/env.d.ts","src/main.ts","src/motion.ts","src/pages/assist.ts","src/pages/billing.ts","src/pages/help.ts","src/pages/insights.ts","src/pages/labs.ts","src/pages/messages.ts","src/pages/patients.ts","src/pages/plans.ts","src/pages/records.ts","src/pages/schedule.ts","src/pages/scripts.ts","src/pages/settings.ts","src/pages/supplies.ts","src/pages/tasks.ts","src/pages/today.ts","src/pages/types.ts","src/store.ts","src/teeth.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":424,"likes":8,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T10:54:22.948Z","releases":[{"id":286,"version":"1.0.3","date":"2026-10-21","title":"Smoother page changes","notes":"Going into or out of Patients, Clinical or Messages no longer makes the page jump: the row of sub-tabs now appears or goes while the pages swap, so nothing shifts on screen. Nothing else changed."},{"id":281,"version":"1.0.2","date":"2026-10-21","title":"A plain background","notes":"The pastel colour wash behind the app is gone: the page is one flat near-white with white cards on it, each with a thin border and a soft shadow, and dark mode is one flat dark page. The soft colour fades on the Help search, the busy chairs, record tiles, task columns and the profile card are gone too, and the invoice's top stripe is one solid line. Each page's key figures stay as solid colour tiles. Nothing else changed."},{"id":278,"version":"1.0.1","date":"2026-10-21","title":"New look: tabs, dock and a pastel skin","notes":"The sidebar is replaced by page tabs across the top with a dark pill that slides to the page you are on. Patients, Clinical and Messages open a glass row of their own pages, and the tab remembers the last one you opened. Assist, Supplies, Settings and Help sit in a dark dock on the left; on tablets and phones the tabs scroll in one strip and the dock moves to the bottom. A soft pastel background with frosted panels, each page's key figures as solid colour tiles, light and dark both redone, and Urbanist for all text. Every page and feature works as before; the sidebar-fold setting is gone with the sidebar."},{"id":253,"version":"1.0.0","date":"2026-10-19","title":"First release","notes":"Ivora shipped, with the reel recorded from the real page."}]},{"id":199,"slug":"kairo","name":"Kairo","kind":"template","category":"layout","tagline":"A revenue dashboard for subscription businesses","description":"A six-page dashboard that shows monthly revenue, customers and deals for a subscription business. Good for: a software company, a membership site or any business with monthly plans. How it works: pick a metric and the chart, table and comparisons all switch to it, and hover the chart to read each month. Includes: dashboard, reports for ten metrics, customers with profiles, opportunities, benchmarks, tasks, CSV export and a phone layout. How to use: it comes with two years of sample data, so replace it with your own backend. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":9000,"sizeKb":67.2,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","index.html","src/chart.ts","src/crm.ts","src/data.ts","src/main.ts","src/motion.ts","src/pages/benchmarks.ts","src/pages/customers.ts","src/pages/dashboard.ts","src/pages/opportunities.ts","src/pages/reports.ts","src/pages/tasks.ts","src/pages/types.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":267,"likes":1,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:38.404Z","releases":[{"id":244,"version":"1.0.0","date":"2026-10-18","title":"First release","notes":"Kairo shipped, with the reel recorded from the real page."}]},{"id":226,"slug":"kelvo","name":"Kelvo","kind":"template","category":"layout","tagline":"A staff, shifts and payroll app for shift teams","description":"An app for planning staff shifts, approving time off and running monthly pay. Good for: gyms, shops, cafes and any business that works in shifts. How it works: you drag shifts on a weekly plan, and a strip above shows each hour where you have too few people. Includes: open shifts with suggested cover, time off, timesheets, hiring, payroll with payslips, staff profiles, a calendar, reports, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":218.1,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/attendance.css","css/calendar.css","css/hiring.css","css/overview.css","css/payroll.css","css/people.css","css/reports.css","css/settings.css","css/support.css","index.html","src/actions.ts","src/charts.ts","src/drag.ts","src/main.ts","src/motion.ts","src/pages/attendance.ts","src/pages/calendar.ts","src/pages/hiring.ts","src/pages/overview.ts","src/pages/payroll.ts","src/pages/people.ts","src/pages/reports.ts","src/pages/settings.ts","src/pages/support.ts","src/pages/types.ts","src/roster.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":373,"likes":5,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:40.221Z","releases":[{"id":276,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Kelvo shipped, with the reel recorded from the real page."}]},{"id":240,"slug":"kerfa","name":"Kerfa","kind":"template","category":"layout","tagline":"A glass sales dashboard with a drag-and-drop deal board","description":"A sales dashboard for a business that sells to designers, hotels, shops and walk-in customers, shown with sample data from a furniture workshop. Good for: sales teams and owners who track deals, quotes, orders and targets in one place. How it works: the overview shows revenue against last year, and switching the range or turning a sales channel off reshapes the chart, while a deal dragged onto Won on the pipeline board becomes a real order and counts toward its rep's target. Includes: quarter progress against a weekly target, a next-meeting countdown, a deal board with undo and keyboard moves, a deal list, orders moving through each step with deposits, a quote builder with discounts and quote documents you send and accept, customer accounts with a yearly chart and notes, products with price, margin and stock, a team leaderboard, target sliders, a report builder with CSV export, a choice of seven accent colours and two background photos, a reduce-transparency switch, search with ⌘K, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data saved in the browser with no backend, so add your own data and server. Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":113.8,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/accounts.css","css/help.css","css/orders.css","css/overview.css","css/pipeline.css","css/products.css","css/quotes.css","css/reports.css","css/settings.css","css/team.css","index.html","src/App.tsx","src/actions.tsx","src/env.d.ts","src/finder.tsx","src/main.tsx","src/motion.ts","src/pages/accounts.tsx","src/pages/help.tsx","src/pages/orders.tsx","src/pages/overview.tsx","src/pages/pipeline.tsx","src/pages/products.tsx","src/pages/quotes.tsx","src/pages/reports.tsx","src/pages/settings.tsx","src/pages/team.tsx","src/pages/types.ts","src/router.ts","src/store.ts","src/ui/charts.tsx","src/ui/format.ts","src/ui/icons.tsx","src/ui/kit.tsx","src/ui/overlay.tsx","tsconfig.json"],"downloads":0,"views":637,"likes":2,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T16:26:37.444Z","releases":[{"id":303,"version":"1.0.0","date":"2026-10-26","title":"First release","notes":"Kerfa shipped, with the reel recorded from the real page."}]},{"id":159,"slug":"kessler","name":"Kessler","kind":"template","category":"layout","tagline":"A six-page online store with a working shopping bag","description":"A six-page online store template for a small fashion or goods brand. Good for: launching a shop front for clothing, bags or accessories. How it works: shoppers search, filter and sort products, open a quick view to pick a colour and size, and add items to a bag that remembers them. Includes: home, shop, product, cart, checkout and account pages, two scroll videos, 25 photos and a phone layout. Payments: checkout takes no real payment, so connect Stripe, Shopify or your own backend. How to use: edit the product list in one file, no framework needed.","priceCents":6500,"sizeKb":48.3,"deps":0,"stack":["vanilla","css","lucide"],"install":"","files":["index.html","shop.html","product.html","cart.html","checkout.html","account.html","assets/css/site.css","assets/js/site.js","design-system/styles.css"],"downloads":0,"views":67051,"likes":2469,"relatedSlugs":["sola","atelier","coterie"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:40.868Z","releases":[{"id":159,"version":"1.0.0","date":"2026-10-03","title":"First release","notes":"Six pages — home, shop, product, cart, checkout and account — with quick view, search, a working bag and scroll-scrubbed film."}]},{"id":212,"slug":"kesta","name":"Kesta","kind":"template","category":"layout","tagline":"A finance app for a film or video production company","description":"A money app for a small production company that tracks budgets and cash for each project. Good for: film studios, video agencies and creative companies. How it works: a chart shows how cash went up and down, and each production has its own budget in its own currency. Includes: 10 pages with four currency wallets, payments, receipts, recurring payments, a cash reserve, contacts, reports, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":11000,"sizeKb":137.5,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/activity.css","css/budgets.css","css/contacts.css","css/help.css","css/overview.css","css/productions.css","css/reports.css","css/reserve.css","css/settings.css","css/wallets.css","index.html","src/actions.ts","src/cashflow.ts","src/charts.ts","src/main.ts","src/motion.ts","src/pages/activity.ts","src/pages/budgets.ts","src/pages/contacts.ts","src/pages/help.ts","src/pages/overview.ts","src/pages/productions.ts","src/pages/reports.ts","src/pages/reserve.ts","src/pages/settings.ts","src/pages/types.ts","src/pages/wallets.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":240,"likes":1,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T13:18:17.880Z","releases":[{"id":262,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Kesta shipped, with the reel recorded from the real page."}]},{"id":166,"slug":"kestrel","name":"Kestrel","kind":"template","category":"layout","tagline":"A marketing analytics dashboard with eleven pages","description":"A marketing dashboard for agencies and growth teams that shows website, ads and social results in one place. Good for: an agency client portal, a marketing tool or an in-house reports page. How it works: charts show a tooltip on hover, change smoothly when you pick a new date range, and visitor numbers tick up live. Includes: overview, SEO, paid ads, social media, data source pages, reports, settings, a quick search with Cmd or Ctrl+K, light and dark mode and a phone layout. How to use: replace the sample data in data.js with your own API. Built with plain HTML, CSS and JavaScript plus GSAP.","priceCents":6000,"sizeKb":69.6,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","app.js","charts.js","data.js","index.html","pages/common.js","pages/overview.js","pages/paid.js","pages/reports.js","pages/seo.js","pages/settings.js","pages/social.js","pages/sources.js","theme.js","ui.js"],"downloads":0,"views":31405,"likes":971,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:42.089Z","releases":[{"id":202,"version":"1.0.0","date":"2026-10-06","title":"First release","notes":"First release: eleven pages — Overview, SEO, Paid ads, Social, Data sources (index plus four source pages), Reports and Settings."},{"id":175,"version":"1.0.2","date":"2026-10-06","title":"A solid phone top bar","notes":"The phone top bar is a solid surface with a tinted search field and a hairline edge, so cards scrolling under it never read as white on white; the desktop bar gains a hairline once content scrolls beneath it."},{"id":173,"version":"1.0.1","date":"2026-10-06","title":"Fits phones and tablets","notes":"Fits phones and tablets: data tables keep their first column in place and scroll sideways inside the card instead of wrapping, chart labels thin out where they would collide, the KPI strip and platform cards reflow to two columns, touch targets meet 44px, inputs no longer zoom the page on iOS, and the sidebar drawer closes on Escape and locks the page behind it."}]},{"id":217,"slug":"kinby","name":"Kinby","kind":"template","category":"layout","tagline":"A family money app with shared cards and pocket money","description":"A money app for a whole family sharing one account, with a card for each person. Good for: family banking apps, budgeting tools and kids' money products. How it works: you swipe through everyone's cards, flip one over, freeze it or set a weekly limit for a child. Includes: 10 pages with pocket money and requests, payments, bills on a calendar, budgets, savings goals, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":155.7,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/activity.css","css/bills.css","css/budgets.css","css/cards.css","css/family.css","css/home.css","css/insights.css","css/settings.css","css/support.css","css/transfers.css","index.html","src/actions.ts","src/charts.ts","src/env.d.ts","src/main.ts","src/motion.ts","src/pages/activity.ts","src/pages/bills.ts","src/pages/budgets.ts","src/pages/cards.ts","src/pages/family.ts","src/pages/home.ts","src/pages/insights.ts","src/pages/settings.ts","src/pages/support.ts","src/pages/transfers.ts","src/pages/types.ts","src/store.ts","src/txn.ts","src/ui.ts","src/wallet.ts","tsconfig.json"],"downloads":0,"views":372,"likes":4,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:42.700Z","releases":[{"id":267,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Kinby shipped, with the reel recorded from the real page."}]},{"id":237,"slug":"kinlo","name":"Kinlo","kind":"template","category":"layout","tagline":"A finance and HR back office for a cinema or venue","description":"A finance, payroll and people back office for a business with ticket sales, a bar and private hire, shown with sample data from an independent cinema with two sites. Good for: cinemas, theatres, music venues, clubs and other venues that sell tickets and drinks, pay hourly staff on a rota and sign contracts with suppliers. How it works: the home screen shows takings by stream, cash in the bank and what needs a decision, and every action you take there, such as approving a bill or marking an invoice paid, updates the rest of the app straight away. Includes: takings charts you switch between 7 days, 12 weeks and 12 months and click to break down, bank accounts and transfers, card payments you file in bulk, company cards you freeze or limit, budgets, invoices with a PAID stamp, bills to approve and pay, a VAT return, a weekly rota you drag shifts across, time off with approvals, a pay run you approve and pay, past payslips, a staff directory, an org chart, a hiring board you drag candidates across, contracts with renewals, a ticket-split calculator, contracts you send and countersign, a licence tracker, an inbox, a calendar, a report builder with CSV export, settings, help, search across everything, a sidebar that folds into a slim icon bar, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data saved in the browser with no backend, so connect your own bank feeds, payroll and server. Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":178.3,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/accounts.css","css/calendar.css","css/contracts.css","css/dashboard.css","css/finance.css","css/help.css","css/inbox.css","css/payroll.css","css/people.css","css/reports.css","css/settings.css","index.html","src/App.tsx","src/actions.tsx","src/env.d.ts","src/finder.tsx","src/main.tsx","src/motion.ts","src/pages/accounts.tsx","src/pages/calendar.tsx","src/pages/contracts.tsx","src/pages/dashboard.tsx","src/pages/finance.tsx","src/pages/help.tsx","src/pages/inbox.tsx","src/pages/payroll.tsx","src/pages/people.tsx","src/pages/reports.tsx","src/pages/settings.tsx","src/pages/types.ts","src/router.ts","src/store.ts","src/ui/charts.tsx","src/ui/format.ts","src/ui/icons.tsx","src/ui/kit.tsx","src/ui/overlay.tsx","tsconfig.json"],"downloads":0,"views":106,"likes":1,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T15:56:32.289Z","releases":[{"id":300,"version":"1.0.0","date":"2026-10-26","title":"First release","notes":"Kinlo shipped, with the reel recorded from the real page."}]},{"id":216,"slug":"kofra","name":"Kofra","kind":"template","category":"layout","tagline":"A business bank app for freelancers and small studios","description":"A business banking app for a one-person business or small studio. Good for: freelancers, makers and fintech app makers. How it works: a chart shows your balance and a forecast for the next 30 days, and paid invoices save a share for tax automatically. Includes: 11 pages with payments you press and hold to send, invoices, cards you can flip and freeze, budgets, savings pots, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":231.3,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/analytics.css","css/budgets.css","css/cards.css","css/contacts.css","css/help.css","css/overview.css","css/payments.css","css/pots.css","css/settings.css","css/statements.css","css/transactions.css","index.html","src/actions.ts","src/charts.ts","src/drag.ts","src/main.ts","src/motion.ts","src/pages/analytics.ts","src/pages/budgets.ts","src/pages/cards.ts","src/pages/contacts.ts","src/pages/help.ts","src/pages/overview.ts","src/pages/payments.ts","src/pages/pots.ts","src/pages/settings.ts","src/pages/statements.ts","src/pages/transactions.ts","src/pages/types.ts","src/runway.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":260,"likes":4,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:43.304Z","releases":[{"id":266,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Kofra shipped, with the reel recorded from the real page."}]},{"id":183,"slug":"kvist","name":"Kvist","kind":"template","category":"layout","tagline":"A home goods store with an admin dashboard","description":"A complete online home goods store and its admin dashboard in one app. Good for: starting a small online shop. Includes: home, shop with search, product page, checkout, sign-in, order tracking, and a dashboard for sales, orders, products and categories. How it works: it runs in demo mode with sample data, and your Firebase keys turn on real accounts and a database. Payments are not included, so connect Stripe or another provider before you sell. How to use: swap in your own products and photos, and it works on phone, tablet and desktop. Built with React, Tailwind and Firebase.","priceCents":12000,"sizeKb":113.4,"deps":7,"stack":["react","tailwind","react-router","motion","lenis","lucide-react","firebase"],"install":"","files":[".env.example",".gitignore","README.md","firebase.json","firestore.indexes.json","firestore.rules","index.html","package.json","src/Root.jsx","src/components/ (17 files)","src/context/AuthContext.jsx","src/context/CartContext.jsx","src/data/catalog.js","src/data/catalogStore.ts","src/data/generate.js","src/data/product.ts","src/hooks/useMediaQuery.js","src/hooks/useNow.js","src/hooks/useOrders.js","src/hooks/usePointerParallax.js","src/hooks/useSimulation.js","src/hooks/useSize.js","src/index.css","src/lib/asset.js","src/lib/chart.js","src/lib/format.js","src/lib/image.ts","src/lib/metrics.js","src/lib/record.js","src/main.jsx","src/pages/Account.jsx","src/pages/Checkout.jsx","src/pages/Home.jsx","src/pages/Login.jsx","src/pages/NotFound.jsx","src/pages/Product.jsx","src/pages/RouteError.jsx","src/pages/Shop.jsx","src/pages/dashboard/ (11 files)","src/pages/dashboard/widgets/ (8 files)","src/router.jsx","src/services/backend.js","src/services/demoBackend.js","src/services/firebaseBackend.js","storage.rules","tsconfig.json","vercel.json"],"downloads":0,"views":38077,"likes":1498,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:43.911Z","releases":[{"id":219,"version":"1.0.3","date":"2026-10-14","title":"A Categories page","notes":"A Categories tab in the dashboard sidebar lists every category with its live and draft product counts. Add one, rename it in place (it keeps its shop URL, so links still work), or delete it: if products still use it, you pick where they move and they move in the same step. The five built-in categories stay fixed, since the home page is laid out around them."},{"id":218,"version":"1.0.2","date":"2026-10-14","title":"Add categories as you go","notes":"The category list in the product editor ends with “+ Add category…”: name it, and it is selected for the product, gets its own filter and page in the shop once a live product uses it, and syncs to other open tabs. A name that already exists selects that category instead of making a duplicate. In Firebase mode only admins can add categories, and the rules reject a product whose category does not exist."},{"id":217,"version":"1.0.1","date":"2026-10-13","title":"Add, edit and delete products","notes":"A Products page in the dashboard: add, edit and delete products with a live preview of the card, field checks, image upload, finishes and details. Switch any product between live and draft, filter by low stock, and get a warning before deleting that offers to hide it instead. The catalog now lives in the backend (browser storage in demo mode, a Firestore collection with admin-only rules in Firebase mode), so every edit reaches the storefront straight away."},{"id":196,"version":"1.0.0","date":"2026-10-09","title":"First release","notes":"The store, product pages, bag, checkout, sign-in, account and the live admin dashboard, with demo mode out of the box and Firebase setup included."}]},{"id":191,"slug":"ledge","name":"Ledge","kind":"template","category":"layout","tagline":"An inventory and sales dashboard with a shop register","description":"A seven-page dashboard for a shop that sells in store and online. Good for: a small retail shop, a cafe or anyone who needs to track stock and sales. How it works: tap products in the register to build a sale, charge it, and the stock goes down on every page. Includes: overview, register, orders, stock, purchasing, reports, settings, CSV and JSON export, light and dark mode and a phone layout. How to use: it comes with a year of sample data saved in the browser, so connect your own API in src/model.ts. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":11000,"sizeKb":85,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","index.html","src/charts.ts","src/main.ts","src/model.ts","src/motion.ts","src/pages/orders.ts","src/pages/overview.ts","src/pages/products.ts","src/pages/purchasing.ts","src/pages/register.ts","src/pages/reports.ts","src/pages/settings.ts","src/parts.ts","src/route.ts","src/ui.ts","tsconfig.json","views.css"],"downloads":0,"views":48045,"likes":2260,"relatedSlugs":["wharf","coffer","prism"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-22T11:28:10.072Z","releases":[{"id":230,"version":"1.0.1","date":"2026-10-15","title":"Fits phones and tablets","notes":"No table scrolls sideways any more: the product report becomes cards on phones and the stock list turns into list rows where its columns do not fit. Search results and the stock-alert tray open full width on phones, phones held sideways get a top bar that scrolls away and a compact tab bar, the ticket bar steps aside once the ticket is on screen so it never covers Charge, long receipt lines shorten instead of running off the paper, and every control is at least 44px to a finger. Desktop layouts are unchanged."},{"id":228,"version":"1.0.0","date":"2026-10-15","title":"First release","notes":"Ledge shipped, with the reel recorded from the real page."}]},{"id":241,"slug":"ledra","name":"Ledra","kind":"template","category":"layout","tagline":"A money, people and paperwork back office with a cash forecast","description":"A back office for a small studio, shown with sample data from a landscape architecture practice. Good for: owners, office managers and bookkeepers who look after cash, bills, payroll, staff and contracts in one place. How it works: the overview shows money in and out by month with the bank balance over it, and four what-if switches change the next three months of the forecast while the figures update; new card charges wait in a pile until you drag each one into its category or tap the suggested one. Includes: invoices with an overdue filter and a paid stamp, bills you approve and pay, profit and loss, three bank accounts with transfers and statements, company cards you can freeze or give a limit, company filings and deadlines, a four-step pay run, time off, a timesheet heatmap, a staff directory, a hiring board you drag candidates across, an org chart, contracts with signatures and a term map, contract templates, settings, help, search with ⌘K, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend and the suggested categories come from earlier filings in that sample data, so add your own data and server. Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":144.2,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/accounts.css","css/contracts.css","css/money.css","css/overview.css","css/payroll.css","css/people.css","css/settings.css","index.html","src/App.tsx","src/actions.tsx","src/drag.ts","src/env.d.ts","src/finder.tsx","src/main.tsx","src/motion.ts","src/pages/accounts.tsx","src/pages/contracts.tsx","src/pages/help.tsx","src/pages/money-bills.tsx","src/pages/money-invoices.tsx","src/pages/money-reports.tsx","src/pages/money-transactions.tsx","src/pages/money.tsx","src/pages/overview.tsx","src/pages/payroll.tsx","src/pages/people.tsx","src/pages/settings.tsx","src/pages/types.ts","src/router.ts","src/store.ts","src/theme.ts","src/ui/cashflow.tsx","src/ui/charts.tsx","src/ui/format.ts","src/ui/icons.tsx","src/ui/kit.tsx","src/ui/overlay.tsx","tsconfig.json"],"downloads":0,"views":40,"likes":0,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T16:28:51.831Z","releases":[{"id":304,"version":"1.0.0","date":"2026-10-26","title":"First release","notes":"Ledra shipped, with the reel recorded from the real page."}]},{"id":202,"slug":"lintel","name":"Lintel","kind":"template","category":"layout","tagline":"A real-estate CRM with listings, deals and live chat","description":"A CRM app for an estate agency to manage homes for sale and rent, deals, leads and client chat. Good for: an estate agent, a property manager or a rental agency. How it works: browse listings as a grid, table or map, open a property page with photos and floor plans, and chat with clients in a side panel. Includes: overview, rentals, sales, deals, leads, contacts, property pages and a live chat with voice notes and photos. How to use: it comes with sample data, so replace it with your own backend. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":11000,"sizeKb":211.3,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/chat.css","css/contacts.css","css/deals.css","css/leads.css","css/listings.css","css/overview.css","css/property-tabs.css","css/property.css","index.html","src/actions.ts","src/charts.ts","src/chat.ts","src/floorplan.ts","src/main.ts","src/motion.ts","src/pages/contacts-profile.ts","src/pages/contacts.ts","src/pages/deals.ts","src/pages/leads.ts","src/pages/listing-kit.ts","src/pages/overview.ts","src/pages/property-tabs.ts","src/pages/property.ts","src/pages/rentals.ts","src/pages/sales.ts","src/pages/types.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":395,"likes":7,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-22T11:28:52.066Z","releases":[{"id":247,"version":"1.0.0","date":"2026-10-18","title":"First release","notes":"Lintel shipped, with the reel recorded from the real page."}]},{"id":43,"slug":"love","name":"Love","kind":"template","category":"animation","tagline":"A Will you be mine page where No runs away","description":"A cute Will you be mine page where a cat video asks the question. Good for: asking someone out, a Valentine's Day surprise or a fun proposal you share as a link. How it works: try to press No and it jumps away and shrinks while Yes gets bigger. Press Yes and a happy cat video plays with a burst of hearts. Sound: small sounds play, with a mute button. How to use: change the text in the HTML and share the page. No libraries needed.","priceCents":1500,"sizeKb":5.9,"deps":0,"stack":["vanilla","css"],"install":"","files":["cat-ask.mp4","cat-yes.mp4","index.html","poster-ask.jpg","poster-yes.jpg","script.js","style.css"],"downloads":0,"views":36865,"likes":1336,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:49.608Z","releases":[{"id":43,"version":"1.0.0","date":"2026-07-08","title":"First release","notes":"Love shipped as one file, with the reel recorded from the real page."}]},{"id":30,"slug":"love-letter","name":"Love Letter","kind":"template","category":"animation","tagline":"A pixel art love letter opened with an arrow","description":"A pixel art love letter in two parts. Good for: an anniversary, a Valentine's Day surprise or a sweet message you send as a link. How it works: hold to pull Cupid's bow, aim and let go to hit the floating envelope. Inside, a pixel cat waits while the No button runs away and Yes grows, and Yes fires heart confetti. How to use: change the question and text in the HTML and share the page. No libraries needed.","priceCents":1800,"sizeKb":13.5,"deps":0,"stack":["vanilla","css","canvas"],"install":"","files":["index.html","love.css","love.js","record5.html"],"downloads":0,"views":40069,"likes":1604,"relatedSlugs":["birthday","deadline","heartcode"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:50.213Z","releases":[{"id":30,"version":"1.0.0","date":"2026-07-07","title":"First release","notes":"Love Letter shipped as one file, with the reel recorded from the real page."}]},{"id":36,"slug":"lumen","name":"Lumen","kind":"template","category":"form","tagline":"A sign-in page with a pull-cord light bulb","description":"A sign-in page that starts dark, with a sleeping light bulb hanging from a cord. Good for: a fun login screen for an app, a dark mode site or a creative brand. How it works: pull the cord and let go, the bulb wakes up, smiles and glows, and the sign-in form opens. The form has email, password with show and hide, remember me and a sign-in button. Sound: soft click and hum sounds, with a mute button. How to use: copy the files into your site and connect your own login system. No libraries needed.","priceCents":1500,"sizeKb":10.8,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":48995,"likes":1581,"relatedSlugs":["valentine","nocturne","den"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:51.523Z","releases":[{"id":36,"version":"1.0.0","date":"2026-06-30","title":"First release","notes":"Lumen shipped as one file, with the reel recorded from the real page."}]},{"id":208,"slug":"lumora","name":"Lumora","kind":"template","category":"layout","tagline":"A teacher's dashboard for the whole school day","description":"A dashboard for teachers that puts the school day, classes and student work in one place. Good for: schools, tutoring centres and education apps. How it works: a bar shows today's lessons with a line for the current time, you take the register in a tap and drag students around a seating plan. Includes: classes, students, a timetable you drag lessons across, lesson plans, marking, a quiz builder, a gradebook, messages, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":10000,"sizeKb":405,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/assignments.css","css/attendance.css","css/classes.css","css/dashboard.css","css/fees.css","css/homework.css","css/leave.css","css/lessons.css","css/library.css","css/messages.css","css/quiz.css","css/reports.css","css/results.css","css/settings.css","css/students.css","css/timetable.css","css/wren.css","index.html","src/actions.ts","src/bank.ts","src/board.ts","src/charts.ts","src/main.ts","src/motion.ts","src/pages/assignments.ts","src/pages/attendance.ts","src/pages/classes.ts","src/pages/dashboard.ts","src/pages/fees.ts","src/pages/homework.ts","src/pages/leave.ts","src/pages/lessons.ts","src/pages/library.ts","src/pages/messages.ts","src/pages/quiz.ts","src/pages/reports.ts","src/pages/results.ts","src/pages/settings.ts","src/pages/students.ts","src/pages/timetable.ts","src/pages/types.ts","src/pages/wren.ts","src/seating.ts","src/store.ts","src/ui.ts","src/wren.ts","tsconfig.json"],"downloads":0,"views":264,"likes":4,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T07:41:45.795Z","releases":[{"id":279,"version":"1.0.1","date":"2026-10-21","title":"New layout: tabs, sub-tabs and a dock","notes":"The sidebar is replaced by page tabs across the top (Today, Timetable, Classes, Teaching, Results, Messages, Library) with a dark pill that slides to the page you are on. Classes, Teaching and Results open a row of their own pages with live counts, and reopen the one you last had open. Fees, Leave, Ask Wren and Settings sit in a dark dock on the left with tooltips; on tablets and phones the tabs scroll in one strip and the dock becomes a bar along the bottom. A calm, solid page colour with solid cards, each page's key figures as soft colour tiles (deep tones in dark mode), the violet class colour replaced by clay, and Urbanist at the shared size scale. Every page and feature works as before; the sidebar-fold setting is gone with the sidebar."},{"id":256,"version":"1.0.0","date":"2026-10-19","title":"First release","notes":"Lumora shipped, with the reel recorded from the real page."}]},{"id":87,"slug":"lunara","name":"Lunara","kind":"template","category":"form","tagline":"A glass sign-in page over a desert at night","description":"A glass sign-in form over a moonlit desert photo with a camel caravan, blowing sand and shooting stars. Good for: a stylish login page for an app, a travel brand or a creative site. How it works: stardust moves around your cursor and the scene shifts in layers as you move the mouse. On submit, a small figure walks through a door in the button and a checkmark appears. Includes: email, password with show and hide, remember me, and Google and Apple buttons. How to use: copy the files into your site and connect your own login system. No libraries needed.","priceCents":1500,"sizeKb":8.7,"deps":0,"stack":["vanilla","css","canvas","svg"],"install":"","files":["app.js","bg.jpg","caravan.webp","dune.webp","index.html","sand.webp","style.css"],"downloads":0,"views":25457,"likes":849,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:53.370Z","releases":[{"id":87,"version":"1.0.0","date":"2026-07-24","title":"First release","notes":"Lunara shipped as one file, with the reel recorded from the real page."}]},{"id":25,"slug":"mango","name":"Mango","kind":"template","category":"layout","tagline":"A scroll-animated landing page for a fruit shop","description":"A one-page landing site for a fruit shop, where the mango moves with your scroll. Good for: a fruit, juice or food brand, or any single product landing page. How it works: as you scroll, the mango rises through the big title, gets cut open and leads you through story photos, a side-scrolling row of varieties and an order section. Includes: sample photos and text, and a simpler layout for phones. How to use: swap in your own photos and text. Uses GSAP and Lenis for the animation and smooth scrolling.","priceCents":1500,"sizeKb":10.9,"deps":2,"stack":["vanilla","css","svg","gsap","lenis"],"install":"","files":["index.html","main.js","style.css"],"downloads":0,"views":65037,"likes":2031,"relatedSlugs":["nero","moonart","monolith"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:55.185Z","releases":[{"id":25,"version":"1.0.0","date":"2026-06-27","title":"First release","notes":"Mango shipped as one file, with the reel recorded from the real page."}]},{"id":221,"slug":"mavora","name":"Mavora","kind":"template","category":"layout","tagline":"An online store dashboard with sales and order tracking","description":"A dashboard for running an online store, from today's sales to packing orders. Good for: coffee roasters, food brands and other small online shops. How it works: a chart shows sales by channel against a daily goal, and you drag orders across a board from paid to shipped. Includes: 8 pages with orders, products and stock, customers, an inbox, reports, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":143.9,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/customers.css","css/dashboard.css","css/help.css","css/insights.css","css/messages.css","css/orders.css","css/products.css","css/settings.css","index.html","src/actions.ts","src/charts.ts","src/drag.ts","src/main.ts","src/motion.ts","src/pages/customers.ts","src/pages/dashboard.ts","src/pages/help.ts","src/pages/insights.ts","src/pages/messages.ts","src/pages/orders.ts","src/pages/products.ts","src/pages/settings.ts","src/pages/types.ts","src/store.ts","src/takings.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":297,"likes":6,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:55.791Z","releases":[{"id":271,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Mavora shipped, with the reel recorded from the real page."}]},{"id":196,"slug":"mender","name":"Mender","kind":"template","category":"layout","tagline":"A customer support dashboard with a drag-and-drop case board","description":"A dashboard for a support team to handle customer cases from new to solved. Good for: a help desk, a customer success team or a software product's support inbox. How it works: drag cases between stages, assign teammates to each step, and a case that runs past its time limit is marked late. Includes: case board, new case form, case steps, insights charts, search, CSV export, keyboard shortcuts, light and dark mode and a phone layout. How to use: it comes with sample data and no backend, so connect your own API in src/data.ts. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":9000,"sizeKb":49.1,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","index.html","src/avatar.ts","src/cases.ts","src/data.ts","src/dialog.ts","src/icons.ts","src/insights.ts","src/journey.ts","src/main.ts","src/motion.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":28429,"likes":1335,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-22T11:29:38.352Z","releases":[{"id":237,"version":"1.0.1","date":"2026-10-16","title":"Fits small phones","notes":"On phones the case tabs fit: In progress shows as Active on narrow screens, and every tab label fits down to 320px. Search opens as a full-width bar in place of the section tabs. Case cards give their titles more room, the suggested-knowledge table keeps the article, match and status columns, and the steps-by-state bubbles stay on screen. Tablets and desktops are unchanged."},{"id":235,"version":"1.0.0","date":"2026-10-16","title":"First release","notes":"Mender shipped, with the reel recorded from the real page."}]},{"id":139,"slug":"meridian","name":"Meridian","kind":"template","category":"layout","tagline":"A dark investment dashboard with animated charts","description":"A one-screen dark dashboard for tracking investments. Good for: fintech, wealth and investing apps. How it works: pick a time range and the main chart changes shape, hover it to see any day's value, and press Refresh for new numbers. Includes: a performance chart, a watchlist, asset mix bars, a risk gauge and market notes, dark mode only, on desktop, tablet and phone. How to use: replace the sample data in app.js with your own API, since there is no backend and the menu and filters are for show. Built with plain HTML, CSS and JavaScript, and uses GSAP.","priceCents":3500,"sizeKb":13.2,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":76699,"likes":2485,"relatedSlugs":["opal","surge","crest"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:58.316Z","releases":[{"id":201,"version":"1.0.0","date":"2026-09-27","title":"First release","notes":"First release: one dark portfolio dashboard screen with holdings chart, watchlist, asset mix, volatility gauge and market notes."}]},{"id":245,"slug":"merrin","name":"Merrin","kind":"template","category":"layout","tagline":"A sales CRM with a drag-and-drop deal board and a morphing sales chart","description":"A sales CRM app for a brand that sells online, on a marketplace, to shops and in its own store, shown with sample data from a home-goods studio. Good for: a small sales team that tracks deals, orders, stock and customers in one place. How it works: click one of the four headline figures and the chart under it changes to that number, switch between 30 days and 12 months, or take a sales channel out and the rest settle into the gap, and drag a deal to the next stage on the board and the totals update. Includes: an overview with sales by channel against a target pace, where sales come from, what the warehouse has to pack, best sellers, the deal funnel, today's schedule, the latest orders and team activity, a deal board with a list view and a deal panel, customers and trade accounts with segments and a profile panel, orders you can tick and pack together with a returns queue, a photo product catalogue and stock levels with re-orders, invoices with a PAID stamp, shipment tracking, campaigns with results, a week schedule you drag meetings across, one inbox for email, chat and social messages, settings, a support page, search with ⌘K, forms to add orders, deals, customers, invoices, campaigns and events, a sidebar that folds into a slim icon bar, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data saved in the browser with no backend, and a customer's reply in the inbox is simulated, so connect your own data and server. Built with React, TypeScript and GSAP.","priceCents":9000,"sizeKb":144.1,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/campaigns.css","css/customers.css","css/deals.css","css/help.css","css/home.css","css/invoices.css","css/messages.css","css/orders.css","css/products.css","css/schedule.css","css/settings.css","css/shipments.css","index.html","src/App.tsx","src/actions.tsx","src/env.d.ts","src/finder.tsx","src/main.tsx","src/motion.ts","src/pages/campaigns.tsx","src/pages/customers.tsx","src/pages/deals.tsx","src/pages/help.tsx","src/pages/home.tsx","src/pages/invoices.tsx","src/pages/messages.tsx","src/pages/orders.tsx","src/pages/products.tsx","src/pages/schedule.tsx","src/pages/settings.tsx","src/pages/shipments.tsx","src/pages/types.ts","src/router.ts","src/store.ts","src/ui/charts.tsx","src/ui/format.ts","src/ui/icons.tsx","src/ui/kit.tsx","src/ui/overlay.tsx","src/ui/stack.tsx","tsconfig.json"],"downloads":0,"views":0,"likes":0,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-28T17:00:47.568Z","releases":[{"id":308,"version":"1.0.0","date":"2026-10-28","title":"First release","notes":"Merrin shipped, with the reel recorded from the real page."}]},{"id":9,"slug":"mochi","name":"Mochi","kind":"template","category":"form","tagline":"A sign-in page where a cat covers her eyes","description":"A sign-in form guarded by a cute cat. Good for: a friendly login screen for an app, a pet brand or a kids product. How it works: the cat follows your typing while you enter your email and covers her eyes with her paws when you type your password. When you tap show, she peeks through her paws. How to use: copy the files into your site and connect the form to your own login system. No libraries needed.","priceCents":500,"sizeKb":15.8,"deps":0,"stack":["vanilla","css"],"install":"","files":["app.js","index.html","style.css"],"downloads":0,"views":29839,"likes":898,"relatedSlugs":["sigil","bamboo","quarto"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:58.995Z","releases":[{"id":9,"version":"1.0.0","date":"2026-08-01","title":"First release","notes":"Mochi shipped as one file, with the reel recorded from the real page."}]},{"id":28,"slug":"monolith","name":"Monolith","kind":"template","category":"layout","tagline":"A 3D image gallery where cards turn as you swipe","description":"A gallery page that shows six images as tilted 3D cards with a caption for each one. Good for: a photo portfolio, an architecture or art studio, or a product showcase. How it works: drag, use the mouse wheel, the arrow keys or the buttons to move between cards, or let it play on its own. The middle card tilts toward your mouse and each caption appears word by word. How to use: swap in your own images and captions, it uses GSAP for animation.","priceCents":1500,"sizeKb":7.4,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["index.html","monolith.css","monolith.js"],"downloads":0,"views":45299,"likes":2064,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:46:59.602Z","releases":[{"id":28,"version":"1.0.0","date":"2026-06-21","title":"First release","notes":"Monolith shipped as one file, with the reel recorded from the real page."}]},{"id":27,"slug":"moonart","name":"Moonart","kind":"template","category":"layout","tagline":"A space-themed gallery with panels that open on hover","description":"A two-screen gallery page with a space hero and a row of six image panels. Good for: an art or photo portfolio, a music page or a creative studio. How it works: a moon floats over starry layers that follow your mouse. Hover or click a panel and it opens wide while its title appears and the accent colour changes. On desktop the panels also move on their own. How to use: swap in your own images and titles. No libraries needed.","priceCents":1500,"sizeKb":7.5,"deps":0,"stack":["vanilla","css"],"install":"","files":["index.html","moonart.css","moonart.js"],"downloads":0,"views":54931,"likes":2196,"relatedSlugs":["mango","nero","monolith"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:00.812Z","releases":[{"id":27,"version":"1.0.0","date":"2026-06-19","title":"First release","notes":"Moonart shipped as one file, with the reel recorded from the real page."}]},{"id":242,"slug":"moorly","name":"Moorly","kind":"template","category":"layout","tagline":"An insurance broker portal with a stage route you can watch move","description":"A broker portal for a marine insurance company, shown with sample data from a broker who places cover for ferries, fishing fleets, marinas, boatyards, cargo and charter boats. Good for: insurance brokers, agencies and underwriting teams who track applications, renewals, policies and commission in one place. How it works: each application's stages are drawn as a sea route, and once a stage's checklist is ticked and the underwriter's questions are answered, the button moves it on and a small boat sails to the next stop; the quote builder re-prices as you slide the insured value or pick a deductible and sends the new terms as a new version. Includes: a pipeline board you drag applications across, an applications table, a queue of open questions you answer in place, version history with a compare view, document uploads with missing files flagged, renewals by month with a remarketing board, book rolls where you sort each account, policies with endorsements and certificates, monthly statements with a pay flow and a paid stamp, commissions by month and program, integrations with API keys, a rule-based appetite check, a document library, training, settings, help, search with ⌘K, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data saved in the browser with no backend, and uploads stay in the browser, so add your own data and server. Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":168.6,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/application.css","css/applications.css","css/billing.css","css/book.css","css/desk.css","css/help.css","css/integrations.css","css/policies.css","css/renewals.css","css/resources.css","css/settings.css","css/voyage.css","index.html","src/App.tsx","src/actions.tsx","src/env.d.ts","src/finder.tsx","src/main.tsx","src/motion.ts","src/pages/app-docs.tsx","src/pages/app-questions.tsx","src/pages/app-quote.tsx","src/pages/app-versions.tsx","src/pages/application.tsx","src/pages/applications.tsx","src/pages/billing.tsx","src/pages/book.tsx","src/pages/desk.tsx","src/pages/help.tsx","src/pages/integrations.tsx","src/pages/policies.tsx","src/pages/renewals.tsx","src/pages/resources.tsx","src/pages/settings.tsx","src/pages/types.ts","src/router.ts","src/store.ts","src/ui/charts.tsx","src/ui/format.ts","src/ui/icons.tsx","src/ui/kit.tsx","src/ui/overlay.tsx","src/voyage.tsx","tsconfig.json"],"downloads":0,"views":269,"likes":1,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T16:40:18.013Z","releases":[{"id":305,"version":"1.0.0","date":"2026-10-26","title":"First release","notes":"Moorly shipped, with the reel recorded from the real page."}]},{"id":219,"slug":"murmura","name":"Murmura","kind":"template","category":"layout","tagline":"A social media manager for posting to eight networks","description":"An app for planning, posting and tracking social media posts across eight networks in one place. Good for: marketing agencies and in-house social teams. How it works: you write one post and see how it looks on each network, then drag it on a calendar and send it for approval. Includes: 11 pages with a shared inbox, analytics, brand mentions, a photo library, connected accounts, user roles and permissions, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":296.3,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["README.md","app.css","css/analytics.css","css/approvals.css","css/calendar.css","css/channels.css","css/compose.css","css/inbox.css","css/library.css","css/listening.css","css/overview.css","css/preview.css","css/settings.css","css/team.css","index.html","src/actions.ts","src/api.ts","src/calendar-grid.ts","src/charts.ts","src/env.d.ts","src/main.ts","src/motion.ts","src/pages/analytics.ts","src/pages/approvals.ts","src/pages/calendar.ts","src/pages/channels.ts","src/pages/compose.ts","src/pages/inbox.ts","src/pages/library.ts","src/pages/listening.ts","src/pages/overview.ts","src/pages/settings.ts","src/pages/team.ts","src/pages/types.ts","src/preview.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":626,"likes":9,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:01.418Z","releases":[{"id":269,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Murmura shipped, with the reel recorded from the real page."}]},{"id":26,"slug":"nero","name":"Nero","kind":"template","category":"layout","tagline":"A product picker page where each chocolate bar flips in","description":"A one-screen product page for a chocolate brand with four bars to choose from. Good for: a chocolate, coffee or snack shop, or any brand with a few product flavours. How it works: click a small picture or press the arrow keys and the bar turns away while the next one swings in. The background colour and text change to match, and cocoa beans float around the cursor. How to use: swap in your own products, photos and colours, it uses GSAP for animation.","priceCents":1500,"sizeKb":7.9,"deps":1,"stack":["vanilla","css","gsap"],"install":"","files":["index.html","nero.css","nero.js"],"downloads":0,"views":29200,"likes":1164,"relatedSlugs":["mango","moonart","monolith"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:02.069Z","releases":[{"id":166,"version":"1.0.2","date":"2026-10-04","title":"Fits phones","notes":"The header collapses to a cart and a sound button with nothing overlapping, the page never scrolls sideways, and Add to cart and all four flavour thumbnails are easy to reach and tap. Desktop looks the same."},{"id":164,"version":"1.0.1","date":"2026-10-04","title":"Fonts load","notes":"Fonts now load: the Google Fonts link was malformed, so Inter and Fraunces fell back to system fonts."},{"id":26,"version":"1.0.0","date":"2026-07-03","title":"First release","notes":"Nero shipped as one file, with the reel recorded from the real page."}]},{"id":44,"slug":"nocturne","name":"Nocturne","kind":"template","category":"form","tagline":"A glass sign-in page over a forest at night","description":"A glass sign-in form over a night forest scene with falling leaves, fireflies, soft northern lights and a girl riding a bike. Good for: a stylish login page for an app, a game or a creative site. How it works: as you move your mouse, the trees and leaves shift in layers and the card tilts with a soft shine. Includes: username, password with show and hide, remember me, forgot password, and Google and Apple buttons. How to use: copy the files into your site and connect your own login system. No libraries needed.","priceCents":1500,"sizeKb":5.1,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.js","bg.jpg","girl.png","girl_orig.png","index.html","leaf_01.png","leaf_02.png","leaf_03.png","leaf_04.png","style.css","trees.png"],"downloads":0,"views":66421,"likes":2025,"relatedSlugs":["valentine","lumen","den"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:03.297Z","releases":[{"id":44,"version":"1.0.0","date":"2026-07-08","title":"First release","notes":"Nocturne shipped as one file, with the reel recorded from the real page."}]},{"id":160,"slug":"norda","name":"Norda","kind":"template","category":"layout","tagline":"A one-page furniture store that animates as you scroll","description":"A one-page store template for a furniture, interior or home goods brand. Good for: showing a product range on a single page with a strong first impression. How it works: the page opens with the main product growing into place, and pressing plus flies the product into the cart. Includes: hero, new arrivals, categories, best sellers, a room scene, reviews, a contact footer, 19 photos and a phone layout. Note: there is no backend, cart page or checkout. How to use: edit products and text in the HTML, it uses GSAP and Lenis for animation.","priceCents":6500,"sizeKb":13.8,"deps":2,"stack":["vanilla","css","svg","gsap","lenis"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":36003,"likes":1533,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:03.902Z","releases":[{"id":205,"version":"1.0.0","date":"2026-10-03","title":"First release","notes":"First release: a ten-section one-page home-goods storefront with an intro shot, a product swap rail, fly-to-cart, a pinned room scene and all 19 photos."}]},{"id":213,"slug":"noria","name":"Noria","kind":"template","category":"layout","tagline":"A workflow automation app with a visual flow builder","description":"An app for building and watching automatic tasks that run between your business tools. Good for: operations teams and automation products. How it works: you drag steps onto a canvas to make a flow, press Test run to try it, and see every run and failure in a live log. Includes: 8 pages with a live overview, run history, failures grouped by cause, ready-made recipes, an AI helper that drafts flows, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":11000,"sizeKb":147.7,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/builder.css","css/connections.css","css/copilot.css","css/flows.css","css/help.css","css/overview.css","css/recipes.css","css/runs.css","css/settings.css","index.html","src/actions.ts","src/canvas.ts","src/catalog.ts","src/charts.ts","src/main.ts","src/motion.ts","src/pages/builder.ts","src/pages/connections.ts","src/pages/copilot.ts","src/pages/flows.ts","src/pages/help.ts","src/pages/overview.ts","src/pages/recipes.ts","src/pages/runs.ts","src/pages/settings.ts","src/pages/types.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":296,"likes":4,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T13:17:58.296Z","releases":[{"id":263,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Noria shipped, with the reel recorded from the real page."}]},{"id":218,"slug":"obolo","name":"Obolo","kind":"template","category":"layout","tagline":"A business money app with wallets in four currencies","description":"A money app for a business that sells abroad and keeps money in euros, dollars, pounds and yen. Good for: exporters, online sellers and fintech app makers. How it works: you see your total balance across all wallets, convert money with a live rate and mark invoices as paid. Includes: 13 pages with a money in and out chart, team cards you can freeze, transfers, payment links, invoices, approvals, budgets, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":282.5,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/accounts.css","css/approvals.css","css/budgets.css","css/calendar.css","css/help.css","css/home.css","css/integrations.css","css/invoices.css","css/payments.css","css/reports.css","css/settings.css","css/team.css","css/transactions.css","index.html","src/actions.ts","src/charts.ts","src/main.ts","src/motion.ts","src/pages/accounts.ts","src/pages/approvals.ts","src/pages/budgets.ts","src/pages/calendar.ts","src/pages/help.ts","src/pages/home.ts","src/pages/integrations.ts","src/pages/invoices.ts","src/pages/payments.ts","src/pages/reports.ts","src/pages/settings.ts","src/pages/team.ts","src/pages/transactions.ts","src/pages/types.ts","src/store.ts","src/txdrawer.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":147,"likes":1,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:06.956Z","releases":[{"id":268,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Obolo shipped, with the reel recorded from the real page."}]},{"id":231,"slug":"olvara","name":"Olvara","kind":"template","category":"layout","tagline":"A back office for a small product brand that makes its own stock","description":"A back office for a small brand that makes, sells and ships its own products, shown with sample data from a skincare studio. Good for: skincare, candle, soap, food and other small-batch makers that sell online, at a counter and to shops. How it works: everything shares one set of data, so releasing a batch from the lab adds its units to stock, packing orders updates the courier countdown and the home screen, and new orders, batches, customers and codes show up across the app. Includes: a home screen with a product shelf that turns between collections with each product's photo, figures and 30-day sales line, a courier pickup countdown, revenue by channel and low stock with a one-click restock, a lab board you drag batches across, a cure schedule you drag and stretch, recipes that scale to any batch size, products, collections and a reviews inbox you reply from, orders with bulk packing and returns, customers with loyalty tiers, ingredients and purchase orders, stockists on a map, the team's week and leave, rewards and discount codes, a report builder with CSV export, settings, help, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data saved in the browser with no backend, so connect your own data, shop and server, and add your own product photos (the sample photos are placeholders in the download). Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":186.1,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/batches.css","css/customers.css","css/inventory.css","css/orders.css","css/overview.css","css/products.css","css/reports.css","css/rewards.css","css/settings.css","css/stockists.css","css/support.css","css/team.css","index.html","src/app.tsx","src/batches-actions.tsx","src/batches-board.tsx","src/batches-formulas.tsx","src/batches-schedule.tsx","src/charts.tsx","src/env.d.ts","src/finder.tsx","src/format.ts","src/forms.tsx","src/main.tsx","src/motion.ts","src/pages/batches.tsx","src/pages/customers.tsx","src/pages/inventory.tsx","src/pages/orders.tsx","src/pages/overview.tsx","src/pages/products.tsx","src/pages/reports.tsx","src/pages/rewards.tsx","src/pages/settings.tsx","src/pages/stockists.tsx","src/pages/support.tsx","src/pages/team.tsx","src/router.ts","src/store.ts","src/ui/icons.tsx","src/ui/kit.tsx","src/ui/overlays.tsx","tsconfig.json"],"downloads":0,"views":157,"likes":2,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T08:27:02.621Z","releases":[{"id":294,"version":"1.0.0","date":"2026-10-25","title":"First release","notes":"Olvara shipped, with the reel recorded from the real page."}]},{"id":232,"slug":"ondra","name":"Ondra","kind":"template","category":"layout","tagline":"A marketing and sales dashboard for brands that sell online and wholesale","description":"A marketing and sales dashboard for a brand that sells online and to shops, shown with sample data from an outdoor gear company. Good for: marketing teams, founders and agencies who track campaigns, channels, budgets and wholesale leads. How it works: the home screen shows revenue, orders, conversion and return on ad spend, and picking one redraws the chart, with each campaign launch marked on it. Includes: a campaign list and a calendar you drag campaigns across, monthly budgets with sliders that move money between channels, a lead inbox and a board you drag leads to won, lead details with a call and email log, channel, funnel and attribution reports, audiences built from simple rules with a live size estimate, a report builder with CSV export, settings with team roles, help, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, and the connected services in settings are switches, so add your own data or server. Built with TypeScript and GSAP.","priceCents":12000,"sizeKb":149.1,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/analytics.css","css/audiences.css","css/campaigns.css","css/help.css","css/leads.css","css/overview.css","css/reports.css","css/settings.css","index.html","src/actions.ts","src/calendar.ts","src/charts.ts","src/drag.ts","src/env.d.ts","src/main.ts","src/motion.ts","src/pages/analytics.ts","src/pages/audiences.ts","src/pages/campaigns.ts","src/pages/help.ts","src/pages/leads.ts","src/pages/overview.ts","src/pages/reports.ts","src/pages/settings.ts","src/pages/types.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":75,"likes":0,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T08:27:59.444Z","releases":[{"id":295,"version":"1.0.0","date":"2026-10-25","title":"First release","notes":"Ondra shipped, with the reel recorded from the real page."}]},{"id":192,"slug":"oria","name":"Oria","kind":"template","category":"layout","tagline":"A furniture store with shop, product pages, bag and checkout","description":"A multi-page online store template for a furniture and home goods brand. Good for: a furniture, ceramics, lighting or home decor shop. How it works: the home page animates as you scroll, shoppers filter the shop, pick a finish on a product page and add it to a bag that remembers their items. Includes: home, shop, product, bag, checkout, order confirmation, delivery and workshop pages. Payments: there is no backend, so connect Stripe or your own server to take real orders. How to use: edit the product list and text, it uses GSAP and Lenis for animation.","priceCents":7000,"sizeKb":37.5,"deps":2,"stack":["vanilla","css","svg","lenis","gsap"],"install":"","files":["app.css","bag/index.html","base.css","checkout/index.html","delivery/index.html","index.html","order/index.html","pages.css","partials/footer.html","partials/header.html","product/index.html","shop/index.html","src/art.ts","src/bag.ts","src/catalog.ts","src/main.ts","src/pages/cart.ts","src/pages/checkout.ts","src/pages/info.ts","src/pages/order.ts","src/pages/product.ts","src/pages/shop.ts","src/shell.ts","tsconfig.json","workshop/index.html"],"downloads":0,"views":28570,"likes":1164,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:08.167Z","releases":[{"id":229,"version":"1.0.0","date":"2026-10-15","title":"First release","notes":"First release: the home page and a seven-page demo store (shop, product, bag, checkout, order, workshop, delivery)."}]},{"id":182,"slug":"orrery","name":"Orrery","kind":"template","category":"layout","tagline":"An admin console for an AI API service","description":"An admin dashboard for a company that sells AI through an API. Good for: an AI startup, a developer tool or any service where customers use API keys and pay by usage. How it works: type in the playground and the reply streams in, then the request shows up in the logs, the usage counters and the bill. Includes: sign-in, overview, playground, logs, usage, API keys, models, billing, team, settings, CSV downloads, light and dark mode and a phone layout. How to use: it comes with sample data and no backend, so connect your own API in js/data.js. Built with plain HTML, CSS and JavaScript plus GSAP.","priceCents":10500,"sizeKb":68.8,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","app.js","index.html","js/auth.js","js/billing.js","js/bits.js","js/charts.js","js/data.js","js/keys.js","js/logs.js","js/models.js","js/motion.js","js/overview.js","js/playground.js","js/settings.js","js/team.js","js/ui.js","js/usage.js","views.css"],"downloads":0,"views":15003,"likes":694,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-24T11:37:40.713Z","releases":[{"id":197,"version":"1.0.0","date":"2026-10-09","title":"First release","notes":"First release: sign-in, Overview, Playground, Logs, Usage, API keys, Models, Billing, Team and Settings, in light and dark themes."}]},{"id":224,"slug":"orvel","name":"Orvel","kind":"template","category":"layout","tagline":"A finance app where every payment is a dot on a chart","description":"A money app for a small business that shows every recent payment as a dot on one chart. Good for: small companies, bookkeepers and fintech app makers. How it works: you drag across the chart to pick some days, and the list of payments below shows just those days. Includes: 12 pages with a queue for sorting payments, company cards you can freeze, invoices, bills that need two approvals, reports, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":210.7,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/accounts.css","css/analytics.css","css/bills.css","css/cards.css","css/contacts.css","css/documents.css","css/invoices.css","css/overview.css","css/settings.css","css/support.css","css/team.css","css/transactions.css","index.html","src/actions.ts","src/cashflow.ts","src/charts.ts","src/env.d.ts","src/main.ts","src/motion.ts","src/pages/accounts.ts","src/pages/analytics.ts","src/pages/bills.ts","src/pages/cards.ts","src/pages/contacts.ts","src/pages/documents.ts","src/pages/invoices.ts","src/pages/overview.ts","src/pages/settings.ts","src/pages/support.ts","src/pages/team.ts","src/pages/transactions.ts","src/pages/types.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":194,"likes":2,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:09.380Z","releases":[{"id":274,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Orvel shipped, with the reel recorded from the real page."}]},{"id":204,"slug":"pane","name":"Pane","kind":"template","category":"layout","tagline":"A glassy project management app for small teams","description":"A seven-page project management app with a clear glass look. Good for: a design studio, an agency, a startup or any small team. How it works: drag tasks across the board, start a focus timer, and see projects and team workload at a glance. Includes: home, task board, calendar, projects, insights, team, settings, search, light and dark mode, colour and wallpaper choices and a phone layout. How to use: it comes with sample data and no backend, so connect your own API in src/store.ts. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":12500,"sizeKb":153.2,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/calendar.css","css/home.css","css/insights.css","css/projects.css","css/settings.css","css/tasks.css","css/team.css","index.html","src/actions.ts","src/charts.ts","src/clock.ts","src/focus.ts","src/glass.ts","src/icons.ts","src/island.ts","src/liquid.ts","src/main.ts","src/motion.ts","src/pages/calendar.ts","src/pages/home.ts","src/pages/insights.ts","src/pages/projects.ts","src/pages/settings.ts","src/pages/tasks.ts","src/pages/team.ts","src/pages/types.ts","src/store.ts","src/ui.ts","src/wall.ts","tsconfig.json"],"downloads":0,"views":4369,"likes":31,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-27T16:51:40.987Z","releases":[{"id":260,"version":"1.0.4","date":"2026-10-19","title":"The page scrolls over the task board","notes":"The mouse wheel scrolls the page over the task board, the filter chips, the week calendar and the Insights table; before, the page only scrolled over the sidebar. On computers and tablets the page title no longer floats over the page as you scroll, since the sidebar already shows where you are. Phones keep the title at the top left."},{"id":259,"version":"1.0.3","date":"2026-10-19","title":"Reduce transparency that keeps the layout","notes":"Reduce transparency no longer breaks the layout: the toolbar, sidebar, menus, sheets and search stay where they belong, and every surface turns truly solid. With reduce transparency on in your system settings, the Settings switch shows it on instead of off."},{"id":252,"version":"1.0.2","date":"2026-10-18","title":"A compact Focus widget and clearer notifications","notes":"The Focus widget is compact: the session length sits in the card head, the dial beside the task picker and Start button, and a new \"Focused today\" line shows progress towards a two-hour goal. On tablets Home pairs Today and Focus beside My tasks. On wide screens notifications drop just under the toolbar so they never cover a page title, and the focus-started notice is brief so the live timer appears sooner."},{"id":251,"version":"1.0.1","date":"2026-10-18","title":"Tighter headers, a bigger toolbar, Settings that fills the screen","notes":"Page headers now keep the title and its actions level, with the stats underneath; on wide screens the title shares the toolbar band. The search bar and toolbar buttons are larger, and the focus timer capsule sits beside the toolbar on wide screens. Settings uses the full width on large screens. Phones name the current page at the top left, and small links and switches have finger-sized tap areas."},{"id":249,"version":"1.0.0","date":"2026-10-18","title":"First release","notes":"Pane shipped, with the reel recorded from the real page."}]},{"id":193,"slug":"parley","name":"Parley","kind":"template","category":"layout","tagline":"A customer messaging dashboard for SMS, WhatsApp and email","description":"An eight-page dashboard for a business that talks to its customers by SMS, WhatsApp and email. Good for: a shop, a service business or a marketing tool. How it works: reply to customers in a shared inbox, send campaigns to groups of contacts, and set up automatic messages step by step. Includes: overview, inbox, campaigns, scheduled messages, audience, automations, reports, settings, search and a phone layout. How to use: it comes with sample data and no backend, so connect your own API in src/store.ts. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":11000,"sizeKb":170.6,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/audience.css","css/automations.css","css/campaigns.css","css/inbox.css","css/reports.css","css/scheduled.css","css/settings.css","css/ui.css","index.html","src/charts.ts","src/data.ts","src/main.ts","src/motion.ts","src/pages/audience-profile.ts","src/pages/audience.ts","src/pages/automations-editor.ts","src/pages/automations.ts","src/pages/campaigns-composer.ts","src/pages/campaigns-shared.ts","src/pages/campaigns.ts","src/pages/inbox.ts","src/pages/overview.ts","src/pages/reports-charts.ts","src/pages/reports-data.ts","src/pages/reports.ts","src/pages/scheduled.ts","src/pages/settings-billing.ts","src/pages/settings-channels.ts","src/pages/settings-form.ts","src/pages/settings-team.ts","src/pages/settings.ts","src/pages/types.ts","src/shell.ts","src/store.ts","src/ui.ts"],"downloads":0,"views":20751,"likes":895,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T13:20:49.527Z","releases":[{"id":236,"version":"1.0.1","date":"2026-10-16","title":"Expandable sidebar and a proper phone layout","notes":"The sidebar has an expand and collapse button (the [ key does the same): expanded, it shows every label and the page makes room for it instead of sitting underneath; the choice is remembered, and collapsed icons show a tooltip. On phones the bottom tab bar now holds four pages plus More, a sheet with Scheduled, Automations, Reports and Settings, every tab labelled; form fields are 16px so iPhones never zoom on tap, every control is at least 44px to a finger, and the layout clears the notch and the home bar. A short conversation now sits just above the reply box, as in every chat app, and menus open toward the side with room."},{"id":231,"version":"1.0.0","date":"2026-10-15","title":"First release","notes":"Parley shipped, with the reel recorded from the real page."}]},{"id":223,"slug":"pelago","name":"Pelago","kind":"template","category":"layout","tagline":"A sales dashboard for a small online shop","description":"A sales dashboard for a small brand that sells online, in its own shop and to other stores. Good for: small shops, makers and e-commerce businesses. How it works: a chart compares each month's sales with last year, and you drag orders across a board from packing to shipped. Includes: 10 pages with orders, refunds and returns, products and stock, customers, marketing, finance, reports, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":209.3,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/customers.css","css/demand.css","css/finance.css","css/marketing.css","css/orders.css","css/overview.css","css/products.css","css/reports.css","css/settings.css","css/support.css","index.html","src/actions.ts","src/charts.ts","src/demand.ts","src/details.ts","src/main.ts","src/motion.ts","src/pages/customers.ts","src/pages/demand.ts","src/pages/finance.ts","src/pages/marketing.ts","src/pages/orders.ts","src/pages/overview.ts","src/pages/products.ts","src/pages/reports.ts","src/pages/settings.ts","src/pages/support.ts","src/pages/types.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":316,"likes":7,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:12.514Z","releases":[{"id":273,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Pelago shipped, with the reel recorded from the real page."}]},{"id":225,"slug":"pembra","name":"Pembra","kind":"template","category":"layout","tagline":"A staff, shifts and payroll app for hotels and shift teams","description":"An app for managing staff shifts, attendance and pay for a business with several teams. Good for: hotels, restaurants, care homes and other shift-based businesses. How it works: a live chart shows who is working, late or off sick, and you tap a shift to clock someone in. Includes: a drag-and-drop shift plan, timesheets, time off, hiring, payroll with payslips, reports, an org chart, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":263.7,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/company.css","css/help.css","css/overview.css","css/payroll.css","css/people.css","css/recruitment.css","css/reports.css","css/schedule.css","css/settings.css","index.html","src/actions.ts","src/charts.ts","src/company-org.ts","src/drag.ts","src/help-content.ts","src/main.ts","src/motion.ts","src/pages/company.ts","src/pages/help.ts","src/pages/overview.ts","src/pages/payroll.ts","src/pages/people.ts","src/pages/recruitment.ts","src/pages/reports.ts","src/pages/schedule.ts","src/pages/settings.ts","src/pages/types.ts","src/people-attendance.ts","src/people-directory.ts","src/people-kit.ts","src/people-leave.ts","src/people-profile.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":665,"likes":2,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:13.229Z","releases":[{"id":275,"version":"1.0.0","date":"2026-10-21","title":"First release","notes":"Pembra shipped, with the reel recorded from the real page."}]},{"id":230,"slug":"petalo","name":"Petalo","kind":"template","category":"layout","tagline":"A point of sale and back office for a shop with a till","description":"A point of sale and back office for a small shop with one or more locations, shown with sample data from a florist with two shops. Good for: florists, gift shops, cafes and other counter shops that sell, take orders for later and manage stock and staff. How it works: you tap products onto a sale and take payment at the register, and the sale shows up straight away in sales, on the home screen, in the till's cash and in stock. Includes: a working register with card or phone pay and a tip prompt, cash with change, gift cards and an on-screen receipt with a PAID stamp, a home screen with takings by hour against last week and the day's pick-ups, an order board you drag between stages, sales and refunds, customers, reports with a busy-hours chart, payments and payouts, stock with use-by days and deliveries you check in, a staff rota you drag shifts across, tills you count and close, day closes and exports, settings, security, help, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data saved in the browser with no backend, so connect your own data, payments and server. Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":191.6,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/archive.css","css/customers.css","css/help.css","css/ins-hscroll.css","css/insights.css","css/orders.css","css/overview.css","css/payments.css","css/register.css","css/sales.css","css/secnav.css","css/security.css","css/settings.css","css/stepper.css","css/stock.css","css/team.css","index.html","src/App.tsx","src/actions.tsx","src/drawers.tsx","src/env.d.ts","src/main.tsx","src/motion.ts","src/pages/ (13 files)","src/pages/insights/ (1 files)","src/pages/orders/ (1 files)","src/pages/settings/ (1 files)","src/pages/stock/ (1 files)","src/routes.ts","src/shell.tsx","src/store.ts","src/ui/charts.tsx","src/ui/format.ts","src/ui/hooks.ts","src/ui/icons.tsx","src/ui/kit.tsx","src/ui/overlays.tsx","tsconfig.json"],"downloads":0,"views":57,"likes":2,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T08:24:09.809Z","releases":[{"id":293,"version":"1.0.0","date":"2026-10-25","title":"First release","notes":"Petalo shipped, with the reel recorded from the real page."}]},{"id":49,"slug":"portal","name":"Portal","kind":"template","category":"form","tagline":"A Sign in button with a tiny door you walk through","description":"A sign-in form whose Sign in button has a small door in it. Good for: a fun login screen for an app, a game or a creative site. How it works: press Sign in and the door opens, a small figure walks through and the door shuts behind them. The form then changes to a signed-in card, and Log Out plays it backwards. A wrong form shakes, and each step has a small sound with a mute button. How to use: copy the files into your site and connect your own login system. No libraries needed.","priceCents":1500,"sizeKb":7.4,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["buttons.html","index.html","record-button.html","record-buttons.html","script.js","style.css"],"downloads":0,"views":44358,"likes":1890,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:15.663Z","releases":[{"id":49,"version":"1.0.0","date":"2026-07-09","title":"First release","notes":"Portal shipped as one file, with the reel recorded from the real page."}]},{"id":181,"slug":"portfolio","name":"Portfolio","kind":"template","category":"layout","tagline":"An animated developer portfolio built with React and Tailwind","description":"A dark one-page portfolio website for developers and designers. Good for: showing your work, skills and contact details to clients and employers. How it works: your name flies into place on load and your photo forms from small tiles that move with your mouse and scroll. Includes: an about section that lights up as you read, services, project case studies, a shelf of video clips, a playable mini game and contact buttons. How to use: put your name, links and projects in one settings file, it uses React, Tailwind and GSAP.","priceCents":10000,"sizeKb":57.1,"deps":3,"stack":["react","tailwind","gsap"],"install":"","files":["index.html","src/App.jsx","src/assets/contact_assets/contact_bg.mp4","src/assets/hero_assets/hero_center.png","src/assets/projects/ecommerce.jpg","src/assets/projects/expense.jpg","src/assets/projects/habitflow.jpg","src/assets/projects/mindpixel.jpg","src/components/About.jsx","src/components/Ballista.jsx","src/components/ComingSoon.jsx","src/components/ComponentsShowcase.jsx","src/components/Contact.jsx","src/components/Hero.jsx","src/components/Navbar.jsx","src/components/ParticleFace.tsx","src/components/Project.jsx","src/components/Ricochet.jsx","src/components/Services.jsx","src/config/components.js","src/config/site.js","src/index.css","src/lib/motion.js","src/main.jsx"],"downloads":0,"views":13486,"likes":611,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:16.270Z","releases":[{"id":227,"version":"1.0.1","date":"2026-10-15","title":"A particle portrait","notes":"After the intro, thousands of tiles cut from your project screenshots gather out of the air into your face (WebGL2, one draw call). The tiles part under the cursor and blow apart as you scroll, then come back. On desktop the word drops below the face so nothing crosses it. Reduced motion shows the finished face at once; without WebGL2 the plain photo is shown."},{"id":193,"version":"1.0.0","date":"2026-10-09","title":"First release","notes":"One React app — the thrown-name intro, about, services, work, the reel shelf, a playable headline and contact — with the reel recorded from the real page."}]},{"id":141,"slug":"posy","name":"Posy","kind":"template","category":"animation","tagline":"A birthday card where you hand over a flower","description":"An interactive birthday card with a hand-drawn cat holding a flower. Good for: a birthday surprise you send as a link to a friend or loved one. How it works: drag the flower to the stick figure and he turns around to take it. Then Happy birthday appears letter by letter with a burst of confetti. If you miss, the flower goes back, and Enter or Space hands it over for you. How to use: change the message in the HTML and share the page. No libraries needed.","priceCents":1500,"sizeKb":11.8,"deps":0,"stack":["vanilla","css","canvas","svg"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":40673,"likes":1411,"relatedSlugs":["love-letter","birthday","deadline"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:16.875Z","releases":[{"id":165,"version":"1.0.1","date":"2026-10-04","title":"Fonts load","notes":"Fonts now load: the Google Fonts link was malformed, so Fraunces (with its SOFT and WONK styles) and Inter fell back to system fonts."},{"id":210,"version":"1.0.0","date":"2026-08-22","title":"First release","notes":"First release: an interactive birthday card where you drag the cat's flower to the stick figure, with lettered greeting and confetti."}]},{"id":178,"slug":"prism","name":"Prism","kind":"template","category":"layout","tagline":"A live sales dashboard for an online store","description":"A one-screen dashboard that shows an online store's sales and traffic live. Good for: a shop owner's control room, a wall screen in the office or a store analytics product. How it works: about once a second a new sample order arrives and the charts update, and you can switch between Live, 24 hours, 7 days and 30 days. Includes: eleven panels like revenue, traffic, regions and signups, pause and refresh buttons, CSV export, full screen, dark and light mode and a phone layout. How to use: connect your real data feed in data.js. Built with plain HTML, CSS and JavaScript plus GSAP.","priceCents":7000,"sizeKb":33.4,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","app.js","charts.js","data.js","index.html"],"downloads":0,"views":53982,"likes":2032,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:17.481Z","releases":[{"id":198,"version":"1.0.0","date":"2026-10-08","title":"First release","notes":"First release: one live commerce dashboard with eleven panels, range filters, pause, refresh, CSV export and dark and light themes."}]},{"id":194,"slug":"rapport","name":"Rapport","kind":"template","category":"layout","tagline":"A sales CRM with a deal board, schedule and invoices","description":"An eight-page sales CRM app for a team that sells to customers and sends invoices. Good for: a sales team, an agency or a service business. How it works: drag a deal to the next stage and it takes that stage's colour, and open any customer to see their history, tasks and contact details. Includes: overview, pipeline, customers, schedule, finance with invoices, growth, projects, settings, a quick actions bar and a phone layout. How to use: it comes with sample data, so replace it with your own backend. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":12000,"sizeKb":163.6,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/customers.css","css/finance.css","css/growth.css","css/overview.css","css/pipeline.css","css/projects.css","css/schedule.css","css/settings.css","index.html","src/actions.ts","src/charts.ts","src/main.ts","src/motion.ts","src/pages/customers-profile.ts","src/pages/customers.ts","src/pages/finance.ts","src/pages/growth.ts","src/pages/overview.ts","src/pages/pipeline.ts","src/pages/projects.ts","src/pages/schedule.ts","src/pages/settings.ts","src/pages/types.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":50186,"likes":1462,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:20.592Z","releases":[{"id":241,"version":"1.0.3","date":"2026-10-17","title":"Steady on phones, solid menus","notes":"On phones the page can no longer be dragged sideways: anything that pokes past the screen edge is cut off instead of widening the page, and long words such as email addresses wrap. Menus, the notification and account panels, chart tooltips and dock labels now have a solid background, so the page never shows through their text. Nothing else changes."},{"id":240,"version":"1.0.2","date":"2026-10-16","title":"Made for phones","notes":"On phones every action is in reach: the dock gains a More menu with favourites, log a call, copy link and CSV export. Forms open as a sheet from the bottom of the screen with Cancel and Save always in view, and detail panels slide up with a handle and a close button that stays in sight while you scroll. The dock fits the smallest phones, small phones held sideways get a slim side dock, tapped buttons no longer keep a hover tint, and nothing sits under the notch or the home bar. Desktop is unchanged."},{"id":239,"version":"1.0.1","date":"2026-10-16","title":"Fills tall screens, bigger tap areas","notes":"On tall screens (portrait tablets, tall browser windows) the Pipeline board now fills the screen down to the Won and Lost targets instead of stopping halfway. On touch screens, links inside text and table rows (customer names, invoice numbers) get a full-size tap area, and the Schedule checkboxes are larger. Desktop layouts are unchanged."},{"id":232,"version":"1.0.0","date":"2026-10-16","title":"First release","notes":"Rapport shipped, with the reel recorded from the real page."}]},{"id":138,"slug":"rivet","name":"Rivet","kind":"template","category":"layout","tagline":"A black and neon personal finance dashboard","description":"A one-screen personal finance dashboard with a black and neon look. Good for: budgeting apps, banking apps and money trackers. How it works: the cards and charts animate in when the page loads, and react softly when you hover or click. Includes: spending cap, subscriptions, spending by category, a health score, savings goals, cards, quick transfer and recent activity, and it works on desktop, tablet and phone. How to use: comes with sample data, so replace the numbers with your own data or backend. Built with plain HTML, CSS and JavaScript, and uses GSAP for animation.","priceCents":4000,"sizeKb":14.2,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":61040,"likes":2475,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:23.679Z","releases":[{"id":138,"version":"1.0.0","date":"2026-09-27","title":"First release","notes":"Rivet shipped as one file, with the reel recorded from the real page."}]},{"id":236,"slug":"rivlet","name":"Rivlet","kind":"template","category":"layout","tagline":"A finance and HR back office with a drag-to-sort desk","description":"A back office for a small business with several sites, shown with sample data from a group of climbing gyms. Good for: owners, office managers and bookkeepers who look after money, payroll, staff and contracts in one place. How it works: card charges that still need a category wait in a stack, and you drag each one into its category or take the suggested one, and ticking \"always\" files every charge from that shop the same way. Includes: an overview with cash across four bank accounts, money in and out by month and a month-end checklist, transactions, company cards you can freeze, bills, invoices you send and mark paid, a ledger, profit and loss, tax filings, pay runs where you edit hours and approve, a weekly rota you drag shifts across, time off requests, a staff directory, a hiring board, onboarding checklists, contracts you sign with a drawn signature, settings, help, search with ⌘K, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend and the suggested categories are part of that sample data, so add your own data, server and categoriser. Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":143.3,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/books.css","css/contracts.css","css/desk.css","css/help.css","css/home.css","css/money.css","css/payroll.css","css/people.css","css/settings.css","index.html","src/App.tsx","src/actions.tsx","src/env.d.ts","src/finder.tsx","src/main.tsx","src/motion.ts","src/pages/books.tsx","src/pages/contracts.tsx","src/pages/help.tsx","src/pages/home.tsx","src/pages/money-bills.tsx","src/pages/money-cards.tsx","src/pages/money-tx.tsx","src/pages/money.tsx","src/pages/payroll.tsx","src/pages/people.tsx","src/pages/settings.tsx","src/pages/types.ts","src/router.ts","src/sortdesk.tsx","src/store.ts","src/ui/charts.tsx","src/ui/format.ts","src/ui/icons.tsx","src/ui/kit.tsx","src/ui/overlay.tsx","tsconfig.json"],"downloads":0,"views":95,"likes":2,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T15:38:55.577Z","releases":[{"id":299,"version":"1.0.0","date":"2026-10-26","title":"First release","notes":"Rivlet shipped, with the reel recorded from the real page."}]},{"id":211,"slug":"rivolo","name":"Rivolo","kind":"template","category":"layout","tagline":"A money app for freelancers with tax and savings pots","description":"A money app for freelancers that splits money into pots for spending, tax and savings. Good for: freelancers, small studios and fintech app makers. How it works: one bar shows all your pots and what is safe to spend, and you press and hold to send a payment. Includes: 11 pages with a money flow chart, cards, client invoices that set aside tax, a bill calendar, payment history, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":224.2,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/activity.css","css/calendar.css","css/connections.css","css/help.css","css/inbox.css","css/insights.css","css/payees.css","css/payments.css","css/settings.css","css/today.css","css/wallet.css","index.html","src/actions.ts","src/charts.ts","src/deck.ts","src/flow.ts","src/main.ts","src/motion.ts","src/pages/activity.ts","src/pages/calendar.ts","src/pages/connections.ts","src/pages/help.ts","src/pages/inbox.ts","src/pages/insights.ts","src/pages/payees.ts","src/pages/payments.ts","src/pages/settings.ts","src/pages/today.ts","src/pages/types.ts","src/pages/wallet.ts","src/pcard.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":148,"likes":2,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:24.285Z","releases":[{"id":261,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Rivolo shipped, with the reel recorded from the real page."}]},{"id":229,"slug":"selvar","name":"Selvar","kind":"template","category":"layout","tagline":"A sales dashboard and CRM for teams that sell to businesses","description":"A sales dashboard and CRM for a team that sells to other businesses, shown with sample data from a solar company. Good for: sales teams, founders and agencies who track deals, leads and a quarterly target. How it works: the home screen shows how close the team is to its target and what to do next, and you drag deals between stages on a board. Includes: a quarter-to-target bar with a forecast, a Copilot card and chat that answer set questions from your own data (rule-based, ready to connect to your own AI service), a deal board and a deal list, a forecast you adjust deal by deal, deal details with notes, lead scoring with sliders, a week calendar you drag meetings in, contacts and companies, a report builder with CSV export, team targets, settings, help, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":145,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/calendar.css","css/contacts.css","css/copilot.css","css/help.css","css/leads.css","css/overview.css","css/pipeline.css","css/reports.css","css/settings.css","css/team.css","index.html","src/actions.ts","src/charts.tsx","src/deal.tsx","src/env.d.ts","src/format.ts","src/main.tsx","src/motion.ts","src/pages/calendar.tsx","src/pages/contacts.tsx","src/pages/copilot.tsx","src/pages/help.tsx","src/pages/leads.tsx","src/pages/overview.tsx","src/pages/pipeline.tsx","src/pages/reports.tsx","src/pages/settings.tsx","src/pages/shared.ts","src/pages/team.tsx","src/router.ts","src/shell/Finder.tsx","src/shell/Sidebar.tsx","src/shell/Top.tsx","src/shell/account.ts","src/store.ts","src/theme.ts","src/ui/Form.tsx","src/ui/Icon.tsx","src/ui/flip.ts","src/ui/kit.tsx","src/ui/overlay.tsx","tsconfig.json"],"downloads":0,"views":248,"likes":4,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-25T16:44:22.925Z","releases":[{"id":292,"version":"1.0.0","date":"2026-10-25","title":"First release","notes":"Selvar shipped, with the reel recorded from the real page."}]},{"id":22,"slug":"sleuth","name":"Sleuth","kind":"template","category":"layout","tagline":"A 404 page where your mouse is a magnifying glass","description":"A page not found screen with a detective bird. Good for: the 404 error page of any website or app. How it works: your mouse becomes a magnifying glass and the bird walks to wherever you point. Hidden notes on the floor show up only under the glass. How to use: copy the files into your site, set it as your 404 page and change the text and links. No libraries needed.","priceCents":0,"sizeKb":15,"deps":0,"stack":["vanilla","css"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":35278,"likes":1188,"relatedSlugs":["arachne","atelier","aurelia"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:29.301Z","releases":[{"id":22,"version":"1.0.0","date":"2026-08-18","title":"First release","notes":"Sleuth shipped as one file, with the reel recorded from the real page."}]},{"id":65,"slug":"sneakers","name":"Sneakers","kind":"template","category":"layout","tagline":"A sneaker carousel where shoes turn on a wheel","description":"A product carousel page with six sneakers arranged on a turning wheel. Good for: a shoe shop, a fashion brand or any product with several colours. How it works: press the next or back arrow and the wheel turns to bring the next shoe to the front. Its name, price, colours and description change, and the background colour changes to match. How to use: swap in your own product photos and text in the files. No libraries needed.","priceCents":1500,"sizeKb":1.7,"deps":0,"stack":["vanilla","css"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":38208,"likes":1354,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:29.929Z","releases":[{"id":167,"version":"1.0.1","date":"2026-10-04","title":"Works on phones and tablets","notes":"The shoe wheel sits on top with the product card below, and nothing scrolls sideways. Previous and next are real buttons — keyboard-reachable and labelled — hidden slides leave the tab order, and reduced-motion settings are respected. Desktop looks the same."},{"id":65,"version":"1.0.0","date":"2026-07-12","title":"First release","notes":"Sneakers shipped as one file, with the reel recorded from the real page."}]},{"id":92,"slug":"sola","name":"Sola","kind":"template","category":"layout","tagline":"A shoe shop where the cart is a real shopping bag","description":"A small shoe shop page where the cart is shown as a paper shopping bag. Good for: a fashion or shoe store, a boutique or any small online shop. How it works: Press Add and the shoe flies into the bag, which fills up as you shop. A drawer slides out so you can check your items and go to checkout. Includes: Product cards with photos, prices and ratings, a bag counter and a cart drawer. How to use: Swap in your own products and connect checkout to your payment service. No libraries needed.","priceCents":2000,"sizeKb":16.9,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.js","index.html","style.css"],"downloads":0,"views":39498,"likes":1522,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:31.353Z","releases":[{"id":92,"version":"1.0.0","date":"2026-08-03","title":"First release","notes":"Sola shipped as one file, with the reel recorded from the real page."}]},{"id":82,"slug":"solace","name":"Solace","kind":"template","category":"layout","tagline":"A headphone product page where scrolling plays the video","description":"A one page product website for headphones with a video that moves as you scroll. Good for: a product launch, a tech gadget, headphones or any single product you want to show in detail. How it works: Scroll down and the video turns around the product while a noise meter counts down to silence. Story and spec sections appear as you go. How to use: Replace the video, photos and text with your own product. Uses GSAP and Lenis for smooth scrolling and animation.","priceCents":1500,"sizeKb":7.5,"deps":2,"stack":["vanilla","css","gsap","lenis"],"install":"","files":["Cinematic_product_commercial_f.mp4","app.css","app.js","index.html"],"downloads":0,"views":32904,"likes":1202,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:31.973Z","releases":[{"id":82,"version":"1.0.0","date":"2026-07-18","title":"First release","notes":"Solace shipped as one file, with the reel recorded from the real page."}]},{"id":187,"slug":"solum","name":"Solum","kind":"template","category":"layout","tagline":"A clothing store website with checkout and an admin dashboard","description":"A full online store for a clothing or outdoor brand, with an admin dashboard for the owner. Good for: a fashion, sports or outdoor shop. How it works: the home page plays a film as you scroll, shoppers filter products, pick a size, add to the bag and check out, then track their order. Includes: home, shop, product, cart, checkout, order tracking, account, about, help, an admin area for orders, products and customers, and a phone layout. How to use: it comes with sample data and no backend, and payments are not included, so connect your own API and payment provider. Built with TypeScript, HTML and CSS plus GSAP and Lenis.","priceCents":13000,"sizeKb":127.5,"deps":2,"stack":["vanilla","css","svg","gsap","lenis"],"install":"","files":["about/index.html","account/index.html","admin/admin.css","admin/index.html","app.css","cart/index.html","checkout/index.html","help/index.html","index.html","order/index.html","pages.css","partials/footer.html","partials/header.html","partials/icons.html","partials/overlays.html","product/index.html","shop/index.html","src/admin/chart.ts","src/admin/icons.ts","src/admin/main.ts","src/admin/metrics.ts","src/admin/motion.ts","src/admin/palette.ts","src/admin/toast.ts","src/admin/ui.ts","src/admin/util.ts","src/admin/views/customers.ts","src/admin/views/orders.ts","src/admin/views/overview.ts","src/admin/views/product.ts","src/admin/views/products.ts","src/data.ts","src/fx.ts","src/main.ts","src/pages/about.ts","src/pages/account.ts","src/pages/cart.ts","src/pages/checkout.ts","src/pages/common.ts","src/pages/help.ts","src/pages/order.ts","src/pages/product.ts","src/pages/shop.ts","src/rec.ts","src/shell.ts","src/store.ts","tsconfig.json"],"downloads":0,"views":22931,"likes":834,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:33.285Z","releases":[{"id":221,"version":"1.0.1","date":"2026-10-14","title":"Fits phones and tablets","notes":"The header and its bag button fit 320px screens, a new full-screen menu with numbered links and photo cards, one-line product labels that keep the photo in view, a swipeable category row, form fields paired where they fit, size tables that never split a range, three-column grids on tablets, 44px touch targets, and focus rings only for keyboard users."},{"id":220,"version":"1.0.0","date":"2026-10-14","title":"First release","notes":"Solum shipped, with the reel recorded from the real page."}]},{"id":238,"slug":"solvik","name":"Solvik","kind":"template","category":"layout","tagline":"A sales CRM in frosted glass with a deal board and invoices","description":"An eight-page sales CRM app in a frosted-glass look, for a team that sells to business customers and sends invoices, shown with sample data from a company that sells and installs solar panels. Good for: a sales team, an installer or a service business that tracks deals from first call to paid invoice. How it works: drag a deal to the next stage on the board and its card takes that stage's colour, open any customer to see their deals, tasks and contact details, and mark an invoice paid to see a PAID stamp land on it. Includes: an overview with revenue against a target and a quota ring, a deal board with a list view and a deal panel, a customer directory and profiles, a month and week schedule you drag tasks across, finance with cash flow and invoices you can download, growth reports with CSV export, installation projects with checklists, settings, search across everything, a quick actions bar, dark and light mode, phone, tablet and desktop. How to use: it runs on sample data saved in the browser with no backend, so replace it with your own. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":9000,"sizeKb":166.5,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/customers.css","css/finance.css","css/growth.css","css/overview.css","css/pipeline.css","css/projects.css","css/schedule.css","css/settings.css","index.html","src/actions.ts","src/charts.ts","src/env.d.ts","src/main.ts","src/motion.ts","src/pages/customers-profile.ts","src/pages/customers.ts","src/pages/finance.ts","src/pages/growth.ts","src/pages/overview.ts","src/pages/pipeline.ts","src/pages/projects.ts","src/pages/schedule.ts","src/pages/settings.ts","src/pages/types.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":135,"likes":1,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T16:05:56.214Z","releases":[{"id":301,"version":"1.0.0","date":"2026-10-26","title":"First release","notes":"Solvik shipped, with the reel recorded from the real page."}]},{"id":163,"slug":"sorrel","name":"Sorrel","kind":"template","category":"layout","tagline":"A one-page skincare store where bottles jump into the bag","description":"A one-page store template for a skincare or beauty brand. Good for: a natural skincare, cosmetics or wellness shop. How it works: shoppers drag through the products and press Add to cart to send the bottle flying into a real slide-out bag with quantities and a total. Includes: product row, story section, reviews and a phone layout. Photos: the demo photos are not included, you get same-size placeholders and links to the originals. How to use: add your own photos and text, it uses GSAP and Lenis for animation.","priceCents":5000,"sizeKb":16.1,"deps":2,"stack":["vanilla","css","svg","gsap","lenis"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":42288,"likes":1534,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:33.919Z","releases":[{"id":208,"version":"1.0.0","date":"2026-10-03","title":"First release","notes":"First release: a one-page botanical skincare storefront with a draggable product rail, fly-to-bag cart and a pinned apothecary scene."}]},{"id":214,"slug":"sovra","name":"Sovra","kind":"template","category":"layout","tagline":"A business bank app for a small company with several shops","description":"A business banking app for a small company with several shops and accounts. Good for: shops, studios, small companies and fintech app makers. How it works: a cash flow chart shows money in and out, and you drag across it to total any stretch of time. Includes: 11 pages with accounts and a euro wallet, team cards with limits, bills, invoices, budgets, savings pots, a VAT return, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":247.9,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/accounts.css","css/budgets.css","css/cards.css","css/help.css","css/overview.css","css/payments.css","css/pots.css","css/reports.css","css/settings.css","css/team.css","css/transactions.css","index.html","src/actions.ts","src/charts.ts","src/flow.ts","src/help-articles.ts","src/main.ts","src/motion.ts","src/pages/accounts.ts","src/pages/budgets.ts","src/pages/cards.ts","src/pages/help.ts","src/pages/overview.ts","src/pages/payments.ts","src/pages/pots.ts","src/pages/reports.ts","src/pages/settings.ts","src/pages/team.ts","src/pages/transactions.ts","src/pages/types.ts","src/store.ts","src/ui.ts","src/vite-env.d.ts","tsconfig.json"],"downloads":0,"views":100,"likes":2,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:34.525Z","releases":[{"id":264,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Sovra shipped, with the reel recorded from the real page."}]},{"id":195,"slug":"sprig","name":"Sprig","kind":"template","category":"layout","tagline":"A twelve-page CRM for small agencies and studios","description":"A CRM app for a small agency or studio to manage clients, deals, meetings and email. Good for: a design studio, an agency or a freelancer team. How it works: drag deals across stages on a board, drag meetings on a calendar, and build your own reports by picking what to show. Includes: dashboard, deals, notes, emails, reports, workflows, companies, contacts, meetings, projects, settings, a help center and a phone layout. How to use: it comes with sample data, so replace it with your own backend. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":11000,"sizeKb":287.9,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/companies.css","css/contacts.css","css/dashboard.css","css/deals.css","css/emails.css","css/help.css","css/meetings.css","css/notes.css","css/projects.css","css/reports.css","css/settings.css","css/ui.css","css/workflows.css","index.html","src/charts.ts","src/main.ts","src/motion.ts","src/pages/companies-rec.ts","src/pages/companies.ts","src/pages/contacts.ts","src/pages/dashboard.ts","src/pages/deals.ts","src/pages/emails.ts","src/pages/help.ts","src/pages/meetings.ts","src/pages/notes.ts","src/pages/projects.ts","src/pages/reports-chart.ts","src/pages/reports-sheet.ts","src/pages/reports.ts","src/pages/settings.ts","src/pages/types.ts","src/pages/workflows.ts","src/shell.ts","src/store.ts","src/ui.ts","src/worldmap.ts","tsconfig.json"],"downloads":0,"views":28409,"likes":1060,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-22T11:29:58.720Z","releases":[{"id":234,"version":"1.0.1","date":"2026-10-16","title":"Toolbars fit on tablets","notes":"On tablets and narrow laptops the Dashboard, Projects and Meetings toolbars now fit on one row: secondary buttons turn into icons there, with their names kept for screen readers, instead of one button wrapping onto a row of its own. Phones and desktops are unchanged."},{"id":233,"version":"1.0.0","date":"2026-10-16","title":"First release","notes":"Sprig shipped, with the reel recorded from the real page."}]},{"id":162,"slug":"strada","name":"Strada","kind":"template","category":"layout","tagline":"A car rental landing page where cars drive in and out","description":"A one-page landing site for a luxury car rental business. Good for: car rental, car sales or any vehicle booking service. How it works: pick a car class and the hero car drives off while the next one rolls in. The booking bar is a real form that searches and takes you to a filtered list of cars. Includes: fleet list, deals slider, partner logos, how it works, app section, a dark theme, a phone layout and all 10 images. How to use: change the cars and text and connect your own booking system, it uses GSAP and Lenis for animation.","priceCents":6000,"sizeKb":16.9,"deps":2,"stack":["vanilla","css","svg","gsap","lenis"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":26990,"likes":1234,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:37.018Z","releases":[{"id":209,"version":"1.0.0","date":"2026-10-03","title":"First release","notes":"First release: a one-page car-rental landing page with a class switcher, a working booking form, a filtered fleet and a deals carousel."}]},{"id":184,"slug":"stride","name":"Stride","kind":"template","category":"layout","tagline":"A personal fitness tracker dashboard with eleven pages","description":"A fitness dashboard that shows activity, sleep, heart rate, food and workouts. Good for: a fitness app, a smartwatch companion app or a health product. How it works: log a workout and the activity rings, goals and history all update together, with an Undo button. Includes: overview, activity, heart, sleep, workouts, nutrition, a library of 33 exercises, progress, awards, goals, settings and light and dark mode. How to use: it comes with sample data, so replace it with your own users' data. No libraries needed.","priceCents":7500,"sizeKb":47.9,"deps":0,"stack":["vanilla","css","svg"],"install":"","files":["app.css","app.js","charts.js","exercises.ts","foods.ts","index.html","model.js","search.ts"],"downloads":0,"views":26016,"likes":1112,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:37.706Z","releases":[{"id":243,"version":"1.1.0","date":"2026-10-18","title":"Nutrition, exercises, progress and awards","notes":"Four new pages, eleven in all: Nutrition logs meals against calorie and protein targets; Exercises is a filterable library of 33 movements with how-tos; Progress tracks weigh-ins and personal records; Awards derives 12 badges and an XP level from your history. A notifications bell lists alerts drawn from your data, and a global search reaches every page, exercise, badge and action. Workouts gains time-by-type and intensity breakdowns, and current weight now comes from the latest weigh-in."},{"id":213,"version":"1.0.0","date":"2026-10-10","title":"First release","notes":"Stride shipped, with the reel recorded from the real page."}]},{"id":209,"slug":"sunrow","name":"Sunrow","kind":"template","category":"layout","tagline":"A project app for solar and battery building companies","description":"A business app for companies that build solar farms, battery storage and small power grids. Good for: construction and energy firms that run many building sites at once. How it works: you plan tasks on a timeline chart and drag a task to a new day, and the tasks that wait on it move too. Includes: a dashboard, projects, the schedule, contractors, materials, purchase orders, budgets, approvals, timesheets, safety reports, equipment, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":11000,"sizeKb":370.4,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/approvals.css","css/budget.css","css/contractors.css","css/dashboard.css","css/documents.css","css/equipment.css","css/insights.css","css/materials.css","css/progress.css","css/projects.css","css/purchasing.css","css/reports.css","css/safety.css","css/settings.css","css/support.css","css/timesheet.css","index.html","src/actions.ts","src/assistant.ts","src/charts.ts","src/gantt.ts","src/main.ts","src/motion.ts","src/pages/approvals.ts","src/pages/budget.ts","src/pages/contractors.ts","src/pages/dashboard.ts","src/pages/documents.ts","src/pages/equipment.ts","src/pages/insights.ts","src/pages/materials.ts","src/pages/progress.ts","src/pages/projects.ts","src/pages/purchasing.ts","src/pages/reports.ts","src/pages/safety.ts","src/pages/settings.ts","src/pages/support.ts","src/pages/timesheet.ts","src/pages/types.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":332,"likes":2,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T13:19:07.481Z","releases":[{"id":282,"version":"1.0.1","date":"2026-10-21","title":"New layout: tabs, sub-tabs and a dock","notes":"The sidebar is replaced by page groups as tabs across the top (Overview, Projects, Site, Supply, Money, Insights, Documents) with a dark pill that slides to the group you are on. A group with several pages shows them on a row of its own with live counts. Search, Quick create, Settings, Help and the theme sit in a dark dock on the left with tooltips; on tablets and phones the tabs scroll in one strip and the dock becomes a bar along the bottom. A calm, solid page colour with frosted cards, each page's key figures on soft colour tiles, the violet and lavender tones replaced by cobalt and sea-green, and Urbanist at the shared size scale. The dashboard greeting card is better balanced. Every page and feature works as before; the sidebar-fold setting is gone with the sidebar."},{"id":257,"version":"1.0.0","date":"2026-10-19","title":"First release","notes":"Sunrow shipped, with the reel recorded from the real page."}]},{"id":220,"slug":"talvo","name":"Talvo","kind":"template","category":"layout","tagline":"A finance app for a small business with a cash forecast","description":"A money app for a small business that shows where its cash will be in the next 90 days. Good for: small companies, finance teams and fintech app makers. How it works: a chart shows your future balance, and you drag bills and invoices to other days to see the line change. Includes: 13 pages with bills and approvals, invoices, company cards you can freeze, payroll, budgets, savings, month-end tasks, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":290.1,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/accounts.css","css/assistant.css","css/budgets.css","css/cashflow.css","css/close.css","css/financing.css","css/horizon.css","css/overview.css","css/payments.css","css/payroll.css","css/reports.css","css/settings.css","css/support.css","css/treasury.css","index.html","src/actions.ts","src/assistant.ts","src/charts.ts","src/forecast.ts","src/horizon.ts","src/main.ts","src/motion.ts","src/pages/accounts.ts","src/pages/assistant.ts","src/pages/budgets.ts","src/pages/cashflow.ts","src/pages/close.ts","src/pages/financing.ts","src/pages/overview.ts","src/pages/payments.ts","src/pages/payroll.ts","src/pages/reports.ts","src/pages/settings.ts","src/pages/support.ts","src/pages/treasury.ts","src/pages/types.ts","src/reports-chart.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":158,"likes":2,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:40.767Z","releases":[{"id":270,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Talvo shipped, with the reel recorded from the real page."}]},{"id":186,"slug":"tandem","name":"Tandem","kind":"template","category":"layout","tagline":"A CRM workspace that ranks leads and shows why","description":"A sales app that lists your leads in order of priority and shows each lead's full record. Good for: a sales team or anyone building a sales tool. How it works: pick a lead from the list to see its stage, its next step and a score with the reasons behind it, then move it forward with one click. Includes: lead list and search, lead record, notes and activity, a new lead form, undo, keyboard shortcuts, light and dark mode and a phone layout. How to use: it comes with sample data saved in the browser, so connect your own API in src/data.ts. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":7500,"sizeKb":30.5,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","index.html","src/data.ts","src/main.ts","src/motion.ts","src/render.ts","tsconfig.json"],"downloads":0,"views":36921,"likes":1367,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:41.373Z","releases":[{"id":216,"version":"1.0.0","date":"2026-10-13","title":"First release","notes":"Tandem shipped, with the reel recorded from the real page."}]},{"id":207,"slug":"tavola","name":"Tavola","kind":"template","category":"layout","tagline":"A restaurant dashboard with a kitchen board and floor plan","description":"A nine-page back office app for a restaurant, with a frosted glass look. Good for: a restaurant, bistro or cafe, or a company that builds restaurant software. How it works: drag orders across the kitchen board, drag waiting guests onto a free table, and watch tonight's sales update live. Includes: overview, kitchen board, floor plan, reservations, menu, stock, staff, reports, settings, light and dark mode and a phone layout. How to use: it comes with sample data and no backend, and the dish photos are placeholders, so add your own photos and connect your API in src/store.ts. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":11000,"sizeKb":215.8,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["PHOTOS.md","app.css","css/floor.css","css/inventory.css","css/menu.css","css/orders.css","css/overview.css","css/reports.css","css/reservations.css","css/settings.css","css/staff.css","index.html","src/actions.ts","src/charts.ts","src/clock.ts","src/main.ts","src/motion.ts","src/pages/floor.ts","src/pages/inventory.ts","src/pages/menu.ts","src/pages/orders.ts","src/pages/overview.ts","src/pages/reports.ts","src/pages/reservations.ts","src/pages/settings.ts","src/pages/staff.ts","src/pages/types.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":1207,"likes":5,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T13:18:32.917Z","releases":[{"id":255,"version":"1.0.0","date":"2026-10-19","title":"First release","notes":"Tavola shipped, with the reel recorded from the real page."}]},{"id":198,"slug":"tend","name":"Tend","kind":"template","category":"layout","tagline":"A clinic CRM with a WhatsApp inbox and patient board","description":"A seven-page app for a clinic front desk to manage patients, visits and WhatsApp messages. Good for: a family clinic, a dentist, a physio or any practice that books appointments. How it works: move patients from expected to waiting to seen with one button, and send visit reminders by WhatsApp in one click. Includes: today board, WhatsApp inbox, patients, schedule, campaigns, reports, settings, light and dark mode and a phone layout. How to use: it comes with sample data and sending is only simulated, so point src/whatsapp.ts at your own server that uses the WhatsApp Cloud API. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":12000,"sizeKb":233.6,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/campaigns.css","css/inbox.css","css/patients.css","css/reports.css","css/schedule.css","css/settings.css","css/today.css","index.html","src/actions.ts","src/charts.ts","src/main.ts","src/motion.ts","src/pages/campaigns-broadcasts.ts","src/pages/campaigns-builder.ts","src/pages/campaigns-composer.ts","src/pages/campaigns-shared.ts","src/pages/campaigns-templates.ts","src/pages/campaigns.ts","src/pages/inbox-picker.ts","src/pages/inbox-render.ts","src/pages/inbox.ts","src/pages/patients-profile.ts","src/pages/patients.ts","src/pages/reports-data.ts","src/pages/reports.ts","src/pages/schedule.ts","src/pages/settings-sections.ts","src/pages/settings.ts","src/pages/today.ts","src/pages/types.ts","src/store.ts","src/ui.ts","src/whatsapp.ts","tsconfig.json"],"downloads":0,"views":40906,"likes":1737,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T08:06:15.407Z","releases":[{"id":242,"version":"1.0.0","date":"2026-10-17","title":"First release","notes":"Tend shipped, with the reel recorded from the real page."}]},{"id":235,"slug":"tessly","name":"Tessly","kind":"template","category":"layout","tagline":"A sales CRM with client files, a deal board and a forecast","description":"A sales CRM for a team that sells to other businesses, shown with sample data from a stone and tile supplier. Good for: sales teams, studios and agencies who track clients, deals and follow-ups. How it works: every client has a file with their deals, a timeline of calls, emails, visits and samples you log, their company's open deals by stage, next steps and contact details you edit in place, and you drag deals between stages on a board. Includes: a home screen with revenue and pipeline charts and today's tasks, people and companies, a deal board and a quarter forecast, projects on a timeline, invoices you send and mark paid, commissions and payouts, email sequences and templates, an inbox, a month calendar you drag tasks across, sales playbooks, a team leaderboard, a report builder with CSV export, settings, help, search with ⌘K, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with React, TypeScript and GSAP.","priceCents":12000,"sizeKb":144.1,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/calendar.css","css/clients.css","css/deals.css","css/finance.css","css/inbox.css","css/library.css","css/outreach.css","css/projects.css","css/reports.css","css/settings.css","css/support.css","css/team.css","css/today.css","index.html","src/App.tsx","src/actions.tsx","src/charts.tsx","src/drag.ts","src/env.d.ts","src/format.ts","src/icons.tsx","src/main.tsx","src/motion.ts","src/pages/calendar.tsx","src/pages/clients.tsx","src/pages/deals.tsx","src/pages/finance.tsx","src/pages/inbox.tsx","src/pages/library.tsx","src/pages/outreach.tsx","src/pages/projects.tsx","src/pages/reports.tsx","src/pages/settings.tsx","src/pages/support.tsx","src/pages/team.tsx","src/pages/today.tsx","src/store.ts","src/ui.tsx","tsconfig.json"],"downloads":0,"views":260,"likes":0,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-26T10:17:04.125Z","releases":[{"id":298,"version":"1.0.0","date":"2026-10-26","title":"First release","notes":"Tessly shipped, with the reel recorded from the real page."}]},{"id":21,"slug":"tether","name":"Tether","kind":"template","category":"form","tagline":"A login button that runs away until the form is filled","description":"A sign-in form with a playful login button. Good for: fun login pages and game sites. How it works: while the fields are empty, the button slips away from the mouse on a stretching line. Once both fields are valid, it snaps back so you can click it. How to use: copy the files into your site and connect the form to your own login. No libraries needed.","priceCents":1500,"sizeKb":12.6,"deps":0,"stack":["vanilla","css"],"install":"","files":["README.md","app.css","app.js","index.html"],"downloads":0,"views":26970,"likes":1381,"relatedSlugs":["sigil","bamboo","mochi"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:43.839Z","releases":[{"id":21,"version":"1.0.0","date":"2026-08-17","title":"First release","notes":"Tether shipped as one file, with the reel recorded from the real page."}]},{"id":215,"slug":"tillo","name":"Tillo","kind":"template","category":"layout","tagline":"A money app for a small shop","description":"A money app for a small business with accounts, cards, budgets and savings. Good for: shops, small businesses and fintech app makers. How it works: a cash flow chart shows money in and out by month, and you drag across it to total any run of months. Includes: 10 pages with a three-step send flow, payment requests, cards you can freeze and flip, budgets, savings reserves, reports, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":236.8,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/analytics.css","css/budgets.css","css/goals.css","css/help.css","css/overview.css","css/reports.css","css/settings.css","css/transactions.css","css/transfers.css","css/wallet.css","index.html","src/actions.ts","src/charts.ts","src/env.d.ts","src/main.ts","src/motion.ts","src/pages/analytics.ts","src/pages/budgets.ts","src/pages/goals.ts","src/pages/help.ts","src/pages/overview.ts","src/pages/reports.ts","src/pages/settings.ts","src/pages/transactions.ts","src/pages/transfers.ts","src/pages/types.ts","src/pages/wallet.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":117,"likes":3,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:45.677Z","releases":[{"id":265,"version":"1.0.0","date":"2026-10-20","title":"First release","notes":"Tillo shipped, with the reel recorded from the real page."}]},{"id":203,"slug":"torque","name":"Torque","kind":"template","category":"layout","tagline":"An admin panel for a car repair workshop","description":"An eight-page admin app for a car repair garage to run its bays, jobs, parts and invoices. Good for: a car garage, a tyre shop or a vehicle service center. How it works: see every bay live with its car and timer, drag jobs from check-in to ready for pickup, and send estimates for the customer to approve. Includes: workshop floor, jobs, schedule, customers, parts, invoices, reports, settings and a phone layout. How to use: it comes with sample data, so replace it with your own backend. Built with TypeScript, HTML and CSS plus GSAP.","priceCents":11000,"sizeKb":162.5,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/customers.css","css/floor.css","css/invoices.css","css/jobs.css","css/parts.css","css/reports.css","css/schedule.css","css/settings.css","index.html","src/actions.ts","src/car.ts","src/charts.ts","src/drag.ts","src/main.ts","src/motion.ts","src/pages/customers.ts","src/pages/floor.ts","src/pages/invoices.ts","src/pages/jobs.ts","src/pages/parts.ts","src/pages/reports.ts","src/pages/schedule.ts","src/pages/settings.ts","src/pages/types.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":327,"likes":5,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T13:20:01.845Z","releases":[{"id":250,"version":"1.0.1","date":"2026-10-18","title":"Tables fit at every width","notes":"Tables fit at every width: the job, customer, parts, invoice and technician tables switch to card rows by the width of their own card instead of the screen, and on laptops the job list drops the technician column and the invoice list the issue date (and on a 1366 laptop the car model) so nothing runs past the edge. A tablet or monitor held upright, 1000px wide or more, keeps the full labelled sidebar of the desktop."},{"id":248,"version":"1.0.0","date":"2026-10-18","title":"First release","notes":"Torque shipped, with the reel recorded from the real page."}]},{"id":140,"slug":"vanta","name":"Vanta","kind":"template","category":"layout","tagline":"A dark product launch page with scroll videos","description":"A dark one-page website for launching one tech product, shown with headphones. Good for: headphones, speakers and other gadget launches. How it works: as the visitor scrolls, product videos play and the text changes with them, and the specs count up. Includes: seven sections from hero and specs to a buy section, the videos and photos, on phone and desktop. How to use: swap in your own videos, text and price in index.html, and note Buy is only a link with no checkout. Built with plain HTML, CSS and JavaScript, and uses GSAP and Lenis.","priceCents":2000,"sizeKb":19.9,"deps":2,"stack":["vanilla","css","canvas","svg","gsap","lenis"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":49719,"likes":1776,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:49.368Z","releases":[{"id":211,"version":"1.0.1","date":"2026-10-10","title":"Version 1.0.1","notes":"Invented service names: the immersion and compatibility rows no longer show real brands, and the pairing chips use generic feature names."},{"id":206,"version":"1.0.0","date":"2026-09-27","title":"First release","notes":"First release: a seven-section dark product launch page with four scroll-scrubbed films, scroll-driven gesture tabs, a canvas ribbon and a device hand-off."}]},{"id":68,"slug":"vault","name":"Vault","kind":"template","category":"form","tagline":"A sign up form where the lock grows with your password","description":"A sign up page that shows password strength as a lock that gets stronger. Good for: account sign up, a bank or finance app, or any page that asks for a password. How it works: As you type, the small lock next to the field changes from a bent paperclip to a padlock, then a door bolt, then a bank vault. Delete letters and it goes back down. How to use: Copy the files into your site and connect the form to your own sign up system. Uses GSAP for the animation.","priceCents":2000,"sizeKb":17.9,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["index.html","script.js","style.css"],"downloads":0,"views":18445,"likes":750,"relatedSlugs":["valentine","lumen","nocturne"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:49.991Z","releases":[{"id":68,"version":"1.0.0","date":"2026-07-14","title":"First release","notes":"Vault shipped as one file, with the reel recorded from the real page."}]},{"id":18,"slug":"verso","name":"Verso","kind":"template","category":"form","tagline":"A sign-in card that sweeps over to sign-up","description":"A card with both a sign-in form and a sign-up form. Good for: login and registration pages for apps, shops and member sites. How it works: when you switch between sign in and sign up, a dark slanted band sweeps across the card and the other form appears in mirror layout. How to use: copy the files into your site and connect both forms to your own login. No libraries needed.","priceCents":1500,"sizeKb":12.4,"deps":0,"stack":["vanilla","css"],"install":"","files":["README.md","app.css","app.js","index.html","record-desktop.html","record-mobile.html"],"downloads":0,"views":52273,"likes":2003,"relatedSlugs":["sigil","bamboo","mochi"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:50.598Z","releases":[{"id":18,"version":"1.0.0","date":"2026-08-12","title":"First release","notes":"Verso shipped as one file, with the reel recorded from the real page."}]},{"id":81,"slug":"vesper","name":"Vesper","kind":"template","category":"layout","tagline":"A studio website where scrolling plays the sunset","description":"A one page website for an architecture studio with a video that moves as you scroll. Good for: an architect, interior designer, real estate brand or any studio that sells a mood. How it works: Scroll down and the hero video plays forward, from sunset to night, while text sections appear one by one. Scroll up and it plays back. How to use: Replace the video, photos and text with your own. Uses GSAP and Lenis for smooth scrolling and animation.","priceCents":1500,"sizeKb":12.1,"deps":2,"stack":["vanilla","css","gsap","lenis"],"install":"","files":["app.css","app.js","index.html"],"downloads":0,"views":34962,"likes":1500,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T04:47:51.205Z","releases":[{"id":81,"version":"1.0.0","date":"2026-07-17","title":"First release","notes":"Vesper shipped as one file, with the reel recorded from the real page."}]},{"id":210,"slug":"vessa","name":"Vessa","kind":"template","category":"layout","tagline":"A stock and supply app for a skincare brand","description":"A stock and supply app for a brand that makes and sells its own products, like skincare or cosmetics. Good for: small beauty, food or craft brands. How it works: you see stock in three places, release finished batches after a quality check, and move orders from packing to shipping. Includes: a dashboard, products, raw materials, production batches with expiry dates, an order board, purchasing, storage maps, reports, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":247.6,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/analytics.css","css/customers.css","css/dashboard.css","css/help.css","css/orders.css","css/products.css","css/purchasing.css","css/settings.css","css/warehouses.css","index.html","src/actions.ts","src/charts.ts","src/main.ts","src/motion.ts","src/pages/analytics.ts","src/pages/customers.ts","src/pages/dashboard.ts","src/pages/help.ts","src/pages/orders.ts","src/pages/products.ts","src/pages/purchasing.ts","src/pages/settings.ts","src/pages/types.ts","src/pages/warehouses.ts","src/store.ts","src/ui.ts","tsconfig.json"],"downloads":0,"views":2516,"likes":6,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-21T11:07:01.790Z","releases":[{"id":287,"version":"1.0.4","date":"2026-10-21","title":"A white tab track and finger-sized taps","notes":"The page tabs sit on a clean white track with a thin rim (a dark one in dark mode), so the ink pill of the current tab stands out. On phones and tablets every text link in a row (order and lot numbers, names, links in a sentence), the chart legend toggles and the help chips take a finger-sized press area of about 44px, without moving anything on screen."},{"id":285,"version":"1.0.3","date":"2026-10-21","title":"Copper by default","notes":"Copper is the default brand colour: the logo, buttons, the active sidebar item, charts and the sales-goal fan. Pine green moves into the accent presets (Copper, Pine, Cobalt, Ocean, Graphite). On the Inventory chart, Stock in is now teal so it reads apart from copper Stock out. Nothing else changed."},{"id":284,"version":"1.0.2","date":"2026-10-21","title":"An ink pill for the current tab","notes":"The current page tab is a solid ink pill (a light one in dark mode) that slides between tabs, its label turning as the pill arrives. Nothing else changed."},{"id":277,"version":"1.0.1","date":"2026-10-21","title":"Pine green and cleaner type","notes":"Pine green is the new default brand colour on a pale sage page, with neutral greys in dark mode; the accent presets are Pine, Cobalt, Ocean, Copper and Graphite. Type is Urbanist throughout at one shared size scale, with SKUs, lots and order numbers in tabular figures. The page tabs sit centred in the top bar, the rail highlight follows its rounded corners, and Help shows as active. On phones the help search box no longer makes iPhones zoom, and product and location links are taller to tap."},{"id":258,"version":"1.0.0","date":"2026-10-19","title":"First release","notes":"Vessa shipped, with the reel recorded from the real page."}]},{"id":228,"slug":"vitrea","name":"Vitrea","kind":"template","category":"layout","tagline":"An App Store publishing dashboard with an iPhone-style glass look","description":"A dashboard for a small studio that sells apps on the App Store, with frosted glass cards and controls in the style of the iPhone. Good for: indie app makers, mobile studios and anyone tracking apps, releases and reviews. How it works: drag a release from build to TestFlight, App Review and live, and answer reviews from an inbox with quick replies. Includes: an overview with proceeds and downloads, a release board, app pages, a review inbox, subscribers and retention, product page tests, payouts, a team calendar, settings with a reduce transparency switch, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data with no backend, so add your own data or server. Built with TypeScript and GSAP, no framework.","priceCents":12000,"sizeKb":160.4,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","css/apps.css","css/audience.css","css/growth.css","css/overview.css","css/payouts.css","css/releases.css","css/reviews.css","css/settings.css","css/team.css","index.html","src/actions.ts","src/charts.ts","src/env.d.ts","src/glass.ts","src/liquid.ts","src/main.ts","src/motion.ts","src/pages/apps.ts","src/pages/audience.ts","src/pages/growth.ts","src/pages/overview.ts","src/pages/payouts.ts","src/pages/releases-drag.ts","src/pages/releases.ts","src/pages/reviews.ts","src/pages/settings.ts","src/pages/team.ts","src/pages/types.ts","src/store.ts","src/ui.ts","src/wall.ts","tsconfig.json"],"downloads":0,"views":1178,"likes":4,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-22T18:40:30.545Z","releases":[{"id":290,"version":"1.0.1","date":"2026-10-23","title":"Dark by default","notes":"Vitrea now opens in dark mode, the way the demo shows it. If you pick light or Match system in Settings, your choice is kept."},{"id":289,"version":"1.0.0","date":"2026-10-22","title":"First release","notes":"Vitrea shipped, with the reel recorded from the real page."}]},{"id":165,"slug":"wharf","name":"Wharf","kind":"template","category":"layout","tagline":"A stock and orders dashboard for small shops","description":"A ten-page dashboard for running a small product business. Good for: online shops, small brands and wholesale businesses. How it works: receive a delivery and the stock level, status and overview all update, and move each order to its next step with one button. Includes: Overview, Orders, Stock, Reports, Products, Suppliers, Customers, Team, Settings and Help, light and dark mode and search, on desktop, tablet and phone. How to use: comes with sample data, so replace js/data.js with your own data or backend. Built with plain HTML, CSS and JavaScript, and uses GSAP for animation.","priceCents":8500,"sizeKb":60.5,"deps":1,"stack":["vanilla","css","svg","gsap"],"install":"","files":["app.css","app.js","index.html","js/charts.js","js/customers.js","js/data.js","js/help.js","js/motion.js","js/orders.js","js/overview.js","js/products.js","js/reports.js","js/settings.js","js/stock.js","js/suppliers.js","js/team.js","js/ui.js","views.css"],"downloads":0,"views":20137,"likes":980,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-23T03:50:42.523Z","releases":[{"id":190,"version":"1.0.1","date":"2026-10-09","title":"Reads properly on phones","notes":"Reads properly on phones: orders, stock, customers, activity and invoices become two- and three-line list rows (who or what, the figure that matters, one muted line) instead of labelled forms, so a screen holds about twice as many records; figures no longer float mid-card; the menu and the notifications bell share the top line; supplier rows keep the name on one line with the on-time bar beneath; order and customer details stay in two columns; segmented controls meet touch size. Desktop and tablet layouts are unchanged."},{"id":203,"version":"1.0.0","date":"2026-10-06","title":"First release","notes":"First release: ten pages — Overview, Orders, Stock, Reports, Products, Suppliers, Customers, Team and roles, Settings, Help and support."}]},{"id":244,"slug":"wynlo","name":"Wynlo","kind":"template","category":"layout","tagline":"A sales CRM with a drag-and-drop deal board and a country map","description":"A sales CRM app for a brand that sells online, on marketplaces and to shops, shown with sample data from a skincare company. Good for: a sales team or a growing brand that tracks deals, orders and customers in one place. How it works: drag a deal to the next stage on the board and the totals update, switch the twelve-month chart between revenue, profit and orders and the bars change shape, and click a country on the map to see what it buys. Includes: an overview with monthly sales by channel against a target, four headline figures, a map with one square per country, a deal funnel, best sellers, today's tasks and the latest orders, a deal board with a list view, a deal panel and a forecast, about 2,000 sample orders with filters, bulk updates and a refunds queue, customer accounts with a health score, the people at each account, customer segments, products with stock levels and restocking, tasks, reports with CSV export, a team leaderboard, settings, help, search with ⌘K, forms to add deals, orders, accounts, people and tasks, a sidebar that folds into a slim icon bar, light and dark mode, phone, tablet and desktop. How to use: it runs on sample data saved in the browser with no backend, so replace it with your own data and server. Built with React, TypeScript and GSAP.","priceCents":9000,"sizeKb":141.7,"deps":3,"stack":["react","css","gsap"],"install":"","files":["app.css","css/customers.css","css/help.css","css/home.css","css/orders.css","css/pipeline.css","css/products.css","css/reports.css","css/settings.css","css/tasks.css","index.html","src/App.tsx","src/actions.tsx","src/env.d.ts","src/finder.tsx","src/main.tsx","src/motion.ts","src/pages/customers.tsx","src/pages/help.tsx","src/pages/home.tsx","src/pages/orders.tsx","src/pages/pipeline.tsx","src/pages/products.tsx","src/pages/reports.tsx","src/pages/settings.tsx","src/pages/tasks.tsx","src/pages/types.ts","src/router.ts","src/store.ts","src/ui/charts.tsx","src/ui/format.ts","src/ui/icons.tsx","src/ui/kit.tsx","src/ui/overlay.tsx","tsconfig.json"],"downloads":0,"views":12,"likes":0,"relatedSlugs":["mango","nero","moonart"],"published":true,"offer":{"mode":"store","percent":null,"endsAt":null},"reelShape":null,"updatedAt":"2026-10-28T16:28:57.087Z","releases":[{"id":307,"version":"1.0.0","date":"2026-10-28","title":"First release","notes":"Wynlo shipped, with the reel recorded from the real page."}]}],"placements":{"hero":["meniscus","gyre","lucid","sigil","parachute","quench","gulp"],"featured":["parachute","quarto","sigil","meridian","gulp"],"spotlight":["meniscus"]},"sale":{"percent":40,"label":"Flat sale","endsAt":null},"collections":[{"slug":"every-template","name":"Every template","tagline":"Every page template in the store — dashboards, shops, landing pages and sign-in screens — in one purchase.","intro":"The whole template shelf at the biggest pack saving: sixty-eight dashboards from an AI platform console to twelve CRMs (two for solar sales teams, one with a quota runway and one in frosted glass, one for a stone and tile studio, one for a clinic, with WhatsApp built in, one for an estate agency, one for a mortgage loan officer, one for a skincare brand and one for a home-goods studio), a support desk, a sales workspace, a fitness tracker, an invoicing tool, a shop's point of sale, a customer-messaging inbox, a revenue analytics app, a thirteen-page shop sales dashboard, a car workshop admin panel, a liquid-glass team workspace, a dental practice app, a restaurant operations dashboard, an ERP for a bike maker, a teacher's school dashboard, a field ERP for a solar and storage builder, an inventory app for a skincare lab, a money app for freelancers, a production-finance app for a film studio, a workflow-automation app for a freight forwarder, a money app for a bike shop, business bank accounts for a ceramics studio, a florist and a bakery, a family money app, a business-finance app for a craft brewery, a multi-currency finance app for an olive-oil exporter, a social media management suite with roles, an App Store publishing desk for an iOS studio in liquid glass, a coffee roaster's store dashboard, a florist's point of sale and back office, a homewares shop's point of sale with members and a cash drawer, an outdoor brand's marketing and sales desk, a furniture workshop's sales desk in frosted glass, a back office for a small-batch skincare brand, a ceramics studio's sales console, a card processor's payments operations portal, a marine insurer's broker portal in frosted glass, a vinyl pressing plant's finance console, a finance and HR back office for a group of climbing gyms, a finance and HR back office for an independent cinema, a finance and people back office for another group of climbing gyms, a money, people and paperwork back office for a landscape architecture studio, a money and people back office for a group of veterinary clinics in frosted glass, people, rota and payroll apps for a hotel group and for a group of climbing gyms, complete shops (SOLUM with its own admin dashboard), a React portfolio, scroll-driven landing pages, sign-in screens, 404s and playful one-pagers. One purchase, one download page with every zip, the same licence and free updates to every template in it.","productSlugs":["orrery","halden","kvist","portfolio","fernly","kestrel","coterie","wharf","ledge","fathom","prism","meridian","rivet","kessler","norda","sorrel","sola","strada","bamboo","birthday","caveman","date","deadline","den","flow","gungame","heartcode","huddle","intro","love","love-letter","lumen","lunara","mango","mochi","monolith","moonart","nero","nocturne","portal","posy","sleuth","sneakers","solace","tether","vanta","vault","verso","vesper","stride","coffer","tandem","solum","camber","arden","dwella","gesso","parley","rapport","sprig","oria","mender","accord","tend","kairo","corbel","lintel","hearth","torque","pane","ivora","cadra","tavola","lumora","sunrow","vessa","rivolo","kesta","noria","tillo","kofra","sovra","kinby","obolo","murmura","mavora","grista","pelago","orvel","pembra","talvo","kelvo","folka","vitrea","selvar","petalo","olvara","ondra","ambrel","corvane","tessly","rivlet","kinlo","solvik","coffra","kerfa","ledra","moorly","covry","wynlo","merrin"],"packDiscount":25,"position":5,"published":true,"updatedAt":"2026-10-28T17:00:50.413Z"},{"slug":"dashboards","name":"All dashboards","tagline":"Every dashboard in the store — SaaS, business and finance — at the biggest saving.","intro":"All sixty-eight dashboards: Orrery, an AI platform console; Halden, a sales CRM; Tandem, a sales workspace with a ranked lead queue; Fernly for projects; Kestrel for marketing; Coterie for people ops; Wharf for stock and orders; Ledge, a shop's till, stock and purchasing with a point-of-sale register that prints its receipts; SOLUM, an online store with its own admin dashboard for orders, products and customers; Fathom, a live trading terminal; Prism, live commerce analytics; Stride, a seven-page fitness tracker; Rivet for personal finance; Meridian for a portfolio; Coffer for invoicing and accounting; Parley, a two-way customer inbox with campaigns, automations and reports; Rapport, an eight-page sales CRM with a drag-and-drop pipeline and a profile for every customer; Sprig, a twelve-page studio CRM with a deal kanban, companies, contacts, meetings, email and a report builder; Mender, a support-desk CRM where cases drag between lanes and you assign each case’s steps by dragging people onto them; Accord, an eight-page client-pipeline CRM whose deal cards lean as you drag them, with a profile for every customer, tasks, team activity and projects; Tend, a seven-page clinic CRM with WhatsApp built in, where one button moves a patient from the waiting room into a consult and every reply keeps WhatsApp’s 24-hour rule; Kairo, a six-page revenue analytics app where picking a metric morphs the whole report, with customers, a drag-and-drop deal pipeline, peer benchmarks and tasks; Corbel, a thirteen-page sales dashboard for a shop that sells online and in store, whose dashboard builds itself and morphs every chart between its channels, with products, orders, customers, an inbox, email campaigns, automations and analytics; Lintel, a real-estate CRM for an estate agency where you set a listing's price on a gauge with two sliders, its floor plans draw themselves, offers drag across a deal board, leads are scored and a live chat runs down every page; Hearth, a twelve-page mortgage CRM for loan officers where a closing loan dragged onto Funded floats its commission up, with scored leads, loan files with a six-stage stepper, a borrower document vault you drop real files into and analytics; Torque, an eight-page admin panel for a car repair workshop where each car drives onto its lift, jobs drag across a board from check-in to pickup, and the lights on a repair order’s inspection add their fixes to an estimate the customer approves; Pane, a seven-page team workspace in liquid glass whose focus timer runs in a capsule at the top of the screen, with a drag-and-drop task board, a calendar, projects with milestones, insights and a team directory; Ivora, a fifteen-page practice app for a dental clinic where you tap a tooth to chart what you see, drag bookings across the chairs and sign prescriptions checked against each patient's allergies; Tavola, a nine-page restaurant dashboard in glassmorphism where a ticket dragged onto Ready changes colour and rings the pass and a waiting party dragged onto a free table lights up its chairs, with bookings, menu engineering, stock, a staff rota and reports; Cadra, a twenty-nine-page ERP for a bike maker whose production schedule is a Gantt where dragging one step pushes every later step with it, with a sales board, a showroom till, purchasing, three warehouses, shipments, payroll and a ledger; Lumora, a teacher's school dashboard whose day ribbon lays out every lesson at its real length with a moving now line, with registers taken in a tap, a seating plan you drag students across, a marking queue and an AI quiz builder; Sunrow, a sixteen-section field ERP for a solar and battery-storage builder whose Gantt schedule pushes every waiting task along when you drag one, with projects, contractors, materials, purchase orders, budgets, approvals, safety and equipment; Vessa, a nine-section inventory app for a skincare lab whose inventory chart floods its hatched bars with colour under the pointer, with production batches stamped RELEASED after QA, a pick-pack-ship board you drag orders across, purchasing, bin maps and analytics; Rivolo, an eleven-page money app for a freelancer whose money-flow chart raises money in above the line and hangs money out below it, with every pot on one bar, safe-to-spend shown as its sum, a card deck you flick and freeze, and client invoices that move a share to the tax pot when they're paid; Kesta, a ten-page production-finance app for a film studio whose cash bridge builds the year's balance as a waterfall, month by month, with four currency wallets, budget lines per production in their own currency, a receipts inbox and a cash reserve; Noria, an eight-page workflow-automation app for a freight forwarder's ops desk, where a light walks each live run's steps, a node canvas tests a flow before it goes live and failed runs group by what went wrong; Tillo, a ten-page money app for a bike shop whose cash-flow chart you drag across to total any run of months, with a three-step send flow, cards that frost and turn over, budgets with a pace marker and savings reserves; Kofra, an eleven-page business bank account for a ceramics studio whose balance runway forecasts the next 30 days with every bill and invoice pinned where it lands, with invoices that stamp PAID and feed a tax jar, a hold-to-send payment flow and pots drawn as jars; Sovra, an eleven-page business bank account for a florist whose cash-flow chart you drag across to total any stretch, with a euro wallet, team cards that frost when frozen, invoices that stamp PAID and a VAT return worked out against its pot; Kinby, a ten-page family money app whose wallet of the family's cards is a swipe carousel you flick, flip and freeze, with kids' cards on weekly limits and their money requests, pocket money with chores, a bills calendar with paydays, budgets you set by dragging and goals that fill as jars; Murmura, an eleven-page social media management suite with role-based access, where one post is written for eight networks with a live preview of each, approvals take a stamp and an admin edits every role's permissions in a live matrix; Obolo, a thirteen-page business-finance app for an olive-oil exporter whose money in and out chart raises money in above a zero line and hangs money out below it, with four currency wallets on one mix bar, team cards that flip and freeze, a live converter and approvals that take a stamp; Mavora, an eight-page store dashboard for a coffee roaster whose takings chart stacks every sales channel against the day's goal with a ghost of where today will land, with a live Today ring, a roast queue in kilos and a fulfilment board you drag orders across; Grista, an eleven-page business bank account for a three-shop bakery whose cash is drawn day by day as steps, with the big days pinned and a navigator you drag back through the year, team cards fanned like a hand that lock with a padlock, bills that stamp PAID and a what-if cash forecast; Pelago, a ten-page sales console for a ceramics studio whose demand chart stacks a year of every category by sales channel against last year's outlines, with a 24-hour order dial, a packing bench you drag orders across and refunds that stamp the receipt; Orvel, a twelve-page finance console for a vinyl pressing plant whose payment field draws every payment as a dot, money in above the line and money out below, and narrows the ledger to any days you drag across, with a review queue dealt as a stack, cards that frost and turn over, invoices that stamp PAID and bills that take two sign-offs; Pembra, a nine-section people, rota and payroll app for a two-hotel group whose shift pulse fills every shift up to a now line walking across the day, with a rota you drag shifts across, timesheets, time off that frees shifts, a hiring pipeline and a monthly pay run; Kelvo, a nine-page people, rota and payroll app for a three-gym climbing company whose rota heads every gym with an hourly coverage strip, with shifts you drag across times, days and people, cover suggested for every open shift, time off that opens shifts and a pay run that stamps PAID; Folka, a ten-section people, rota and payroll app for a coffee company whose colour-block overview counts who is on the floor, with a rota you drag shifts across, staff photos, search that approves requests by name and a monthly pay run; Vitrea, a nine-page App Store publishing desk for an iOS studio in liquid glass, where every pane bends the room behind it at its edge, with a release board you drag from build to TestFlight, App Review and live, a review inbox with quick replies, subscriber cohorts, product-page tests and payouts; Selvar, a ten-section sales dashboard and CRM for a solar company whose quarter-to-quota runway fills with won, committed and best-case deals beside a pace tick and a forecast band, with a deal board you drag across, a forecast you adjust deal by deal, lead scoring with live weights and a rule-based Copilot; Petalo, a thirteen-page point of sale and back office for a two-shop florist, with a working register that takes card, cash or a gift card and stamps the receipt PAID, an order board you drag across and stems that count down their vase life; Olvara, a twelve-page back office for a skincare brand whose product shelf turns between collections with each product's photo and sales line, with a courier pickup countdown, a lab board you drag batches into stock, a cure schedule you drag and stretch and recipes that scale; Ondra, an eight-section marketing and sales desk for an outdoor gear brand whose four headline figures switch its performance chart, with campaign launches pinned on the line, a campaign calendar you drag to reschedule, budgets you move between channels and a wholesale pipeline you drag to Won; Ambrel, an eleven-section point of sale for a homewares shop where a product flies into a till-roll ticket, with members and points, card, cash with change, gift card and split payment, a printed receipt with a PAID stamp, a cash drawer counted note by note and a sidebar that folds into an icon rail; Corvane, an eleven-section payments operations portal for a card processor whose threshold lab lets you drag the review and block lines across last month's risk scores to see fraud stopped against good customers blocked, with a review queue, a disputes board you drag to Won, payouts, merchant identity checks and an audit log of every action; Tessly, a thirteen-section sales CRM for a stone and tile studio whose client file logs every call, visit and sample box on a timeline, with the company’s open deals as a ladder, a deal board you drag to Won, a quarter forecast, projects on a timeline and invoices that stamp PAID; Rivlet, a twenty-five-page finance and HR back office for three climbing gyms whose sort desk lets you drag each uncategorised card charge into its category bin, with rules for repeat merchants, cash across four accounts, cards that freeze, invoices that stamp PAID, tax filings, a pay run you approve and a rota you drag shifts across; Kinlo, an eleven-section finance and HR back office for a two-site independent cinema whose takings chart stacks tickets, bar and private hire and morphs between 7 days, 12 weeks and 12 months, with card payments filed in bulk, invoices that stamp PAID, a rota you drag shifts across, a pay run you approve and pay and film-booking contracts you countersign; Solvik, an eight-section sales CRM for a solar installer in frosted glass, whose deals take their stage's tint as you drag them across the board, with customer profiles, a schedule you drag tasks across, invoices that stamp PAID and growth reports; Coffra, a twenty-four-page finance and people back office for three climbing gyms whose cash-flow chart raises money in above the line, split by front desk and online memberships, and hangs money out below it, morphing between ranges and gyms, with a month-end close that ticks itself, transactions filed by suggestion, cards that frost when frozen, a pay run that takes an APPROVED stamp and a calendar you drag events across; Kerfa, a ten-section sales dashboard for a furniture workshop in frosted glass, whose revenue line morphs between ranges and re-adds itself when a sales channel is switched off, with a pipeline board where a deal dragged onto Won books a real order, a quote builder, orders with deposits and quotas you set with sliders; Ledra, an eight-section money, people and paperwork back office for a landscape architecture studio whose cash chart raises money in above the line and hangs money out below it, with a three-month forecast that four what-if switches reshape, card charges you drag into their category bins, invoices that stamp PAID, cards that frost when frozen and a hiring board you drag candidates across; Moorly, a ten-section broker portal for a marine insurer in frosted glass whose application stages are drawn as a sea route a small boat sails along once each stage is clear, with a quote builder that re-prices as you slide, a pipeline board you drag, renewals, book rolls, policies with endorsements and certificates, and agency-bill statements that stamp PAID; Covry, an eleven-section money and people back office for a group of veterinary clinics in frosted glass, with a cash chart that morphs between months, weeks and one clinic, card payments you file from a stack with always-file rules, invoices that stamp PAID, a pay run you approve and contracts signed on a drawn pad; Wynlo, a twenty-page sales CRM for a skincare brand, with twelve months of sales by channel that morph between revenue, profit and orders, a map with one square per country, a deal board you drag with a forecast, and about 2,000 orders with bulk updates and refunds; Merrin, a twelve-page sales CRM for a home-goods studio, with four headline figures that switch a layered sales chart by channel, a deal board you drag, orders packed in bulk, a photo catalogue with stock, and one inbox; and Talvo, a thirteen-page business-finance app for a craft brewery whose 90-day Cash Horizon lets you drag a bill or an invoice to another day and watch the cash line re-form, with a one-press fix when cash dips under the buffer, a card deck you freeze, bills that stamp PAID and a month-end close. Each has calm, transform-only motion, ready to wire to your own data.","productSlugs":["orrery","halden","fernly","kestrel","coterie","wharf","ledge","fathom","prism","meridian","rivet","stride","coffer","tandem","solum","parley","rapport","sprig","mender","accord","tend","kairo","corbel","lintel","hearth","torque","pane","ivora","cadra","tavola","lumora","sunrow","vessa","rivolo","kesta","noria","tillo","kofra","sovra","kinby","obolo","murmura","mavora","grista","pelago","orvel","pembra","talvo","kelvo","folka","vitrea","selvar","petalo","olvara","ondra","ambrel","corvane","tessly","rivlet","kinlo","solvik","coffra","kerfa","ledra","moorly","covry","wynlo","merrin"],"packDiscount":25,"position":8,"published":true,"updatedAt":"2026-10-28T17:00:49.450Z"},{"slug":"login-forms","name":"Login & sign-up forms","tagline":"Sign-in screens with a character — pandas, cats, glass and light.","intro":"Sign-in and sign-up forms people remember: a panda that covers its eyes for your password, a cat that peeks, liquid glass, a door that opens, a password that hatches a guardian. Each is plain HTML, CSS and JavaScript you can drop into any project.","productSlugs":["bamboo","mochi","den","pebble","flow","lunara","nocturne","portal","vault","huddle","verso","tether","warden","lumen"],"packDiscount":20,"position":10,"published":true,"updatedAt":"2026-10-06T14:54:13.051Z"},{"slug":"shop-templates","name":"Shop templates","tagline":"Whole online shops — catalogue, product, bag and checkout, ready for your brand.","intro":"Complete storefronts you can rebrand and launch: SOLUM, a nine-page trail-apparel store with a scroll-played hero film, a full checkout and an admin panel, in TypeScript; KVIST, a bento-grid home-goods store with sign-in and a live admin dashboard, in React, Tailwind and Firebase; Kessler, a six-page leather-goods shop on a modernist grid; Norda, a one-page Nordic home-goods store that moves like a film; Sorrel, a botanical skincare shop where every bottle tosses itself into the bag; Sola, a footwear atelier whose cart is a real shopping bag; Oria, a furniture store with a scroll-film home page, a filterable shop, product pages, a bag and a working checkout, in TypeScript; and Camber, a performance-parts store whose hero swaps between five vehicles and whose build film plays as you scroll. Kessler, Norda, Sorrel, Sola and Camber are plain HTML, CSS and JavaScript.","productSlugs":["kvist","kessler","norda","sorrel","sola","solum","camber","oria"],"packDiscount":25,"position":20,"published":true,"updatedAt":"2026-10-16T09:42:20.302Z"},{"slug":"business-dashboards","name":"Business dashboards","tagline":"Run the company — sales, projects, people, stock, the till and customer messages.","intro":"Forty-one dashboards for running a business: Halden, a six-page sales CRM with a drag-and-drop pipeline; Tandem, a sales workspace where you work a ranked lead queue and every lead score explains itself; Fernly for projects across seven pages; Coterie for people ops and hiring; Wharf for stock and orders; Ledge, a shop's point of sale, stock and purchase orders, where a sale flies into the ticket and prints its receipt; Parley, a two-way inbox for customer messages with campaigns, automations and reports; Rapport, an eight-page sales CRM where a deal takes its stage’s colour as you drag it and every customer has a profile of their deals, tasks and details; Sprig, a twelve-page studio CRM where a deal is dragged into Won, with companies, contacts, meetings, email and a report builder; Mender, a support-desk CRM where cases drag between lanes and you assign each case’s steps by dragging people onto them; Accord, an eight-page client-pipeline CRM whose deal cards lean as you drag them between stages and open dark to show the contact; Tend, a seven-page clinic CRM with a WhatsApp inbox, patient records, a clinician schedule and reminder broadcasts; Corbel, a thirteen-page sales dashboard for a shop that sells online and in store, with products, orders, customers, an inbox, email campaigns, automations and analytics; Lintel, a real-estate CRM where you set a listing's price on a gauge with two sliders, with homes for sale and to rent, a deal board that stamps SOLD, scored leads and a live chat; Hearth, a twelve-page mortgage CRM for loan officers, with leads, loan files, a document vault and a pipeline where a funded loan floats its commission up; Torque, an eight-page admin panel for a car repair workshop, with a live floor of bays and lifts, a job board, repair orders with a digital inspection and customer-approved estimates, a bay planner, parts and invoices; Pane, a seven-page team workspace in liquid glass, with home widgets and activity rings, a focus timer that runs in a capsule at the top, a drag-and-drop task board, a calendar, projects and insights; Ivora, a fifteen-page dental practice app with live chairs, an interactive tooth chart, a chair planner, treatment plans, prescriptions, lab cases and insurance claims; Cadra, an ERP for a bike maker with a drag-and-drop Gantt production schedule, work orders, a sales board, a showroom till, purchasing, three warehouses, shipments, people and payroll, a ledger and invoices; Tavola, a nine-page restaurant operations dashboard in glassmorphism, with a kitchen board you drag tickets across, a floor plan you seat guests on, bookings, menu engineering, stock, a staff rota and sales reports; Lumora, a seventeen-section teacher's dashboard for a school, with a day ribbon, registers, a drag-and-drop seating plan, a timetable, lesson plans, a marking queue, an AI quiz builder and a gradebook; Sunrow, a sixteen-section field ERP for a solar and battery-storage builder, with a drag-and-drop Gantt schedule, projects, contractors, materials and purchase orders, budgets, approvals, timesheets, safety and equipment; Vessa, a nine-section inventory app for a skincare lab, with stock across three locations, production batches with QA release and expiry, a pick-pack-ship order board, purchasing, bin maps and analytics; Noria, an eight-page workflow-automation app for a freight forwarder's ops desk, with a live run pulse, a node-canvas flow builder with test runs and failures grouped by cause; Mavora, an eight-page store dashboard for a coffee roaster, with takings by channel against a daily goal, a live order feed, a roast queue and a fulfilment board you drag orders across; Pelago, a ten-page sales console for a ceramics studio, with demand by category month by month against last year, a 24-hour order dial, a packing bench you drag orders across and kiln firings; Pembra, a nine-section people, rota and payroll app for a two-hotel group, with a live shift pulse, a drag-and-drop rota, timesheets, time off, hiring and a monthly pay run; Kelvo, a nine-page people, rota and payroll app for three climbing gyms, with an hourly coverage strip on a drag-and-drop rota, suggested cover for open shifts, timesheets, time off, hiring and a pay run that stamps PAID; Folka, a ten-section people, rota and payroll app for a coffee company, with a colour-block overview, a drag-and-drop rota with an hourly coverage row, staff photos, time off, hiring and a monthly pay run; Selvar, a ten-section sales dashboard and CRM for a solar company, with a quarter-to-quota runway, a drag-and-drop deal board, a forecast you adjust deal by deal, lead scoring and a rule-based Copilot; Petalo, a florist's point of sale and back office, with a working register, an order board you drag across, stock with vase life, a staff rota and tills you count and close; Olvara, a twelve-page back office for a skincare brand, with a product shelf by collection, a courier pickup countdown, a lab board you drag batches into stock, a cure schedule, orders and returns, stockists and a team rota; Ondra, an eight-section marketing and sales desk for an outdoor gear brand, with a performance chart you switch by its headline figures, a campaign calendar you drag to reschedule, budgets, a wholesale pipeline you drag to Won and channel, funnel and attribution reports; Ambrel, an eleven-section point of sale and back office for a homewares shop, with a register where a product flies into a till-roll ticket, members with tiers and points, a printed receipt, refunds by line, a cash-drawer count, deposits, stock with reorders and closed-day reports; Tessly, a thirteen-section sales CRM for a stone and tile studio, with client files and a touchpoint timeline, a pipeline ladder, a deal board you drag to Won, a quarter forecast, projects, invoices and commissions; Solvik, an eight-section sales CRM in frosted glass for a solar installer, with a drag-and-drop deal board tinted by stage, customer profiles, a schedule, invoices that stamp PAID and growth reports; Kerfa, a ten-section sales dashboard in frosted glass for a furniture workshop, with revenue against last year that morphs by range and channel, a deal board where Won books a real order, a quote builder, orders with deposits, accounts and quotas; Moorly, a ten-section broker portal for a marine insurer in frosted glass, with application stages drawn as a sea route a boat sails along, a quote builder, a pipeline board you drag, renewals, book rolls, policies with endorsements and certificates, and agency bills; Wynlo, a twenty-page sales CRM for a brand selling online, on marketplaces and to shops, with a deal board you drag, a forecast, a country map and about 2,000 orders with a refunds queue; Merrin, a twelve-page sales CRM for a home-goods studio, with a sales chart you switch by headline figure, a deal board you drag, orders packed in bulk and a photo catalogue with stock; and SOLUM, a store admin dashboard for orders, products and customers that ships with the storefront it runs. Each moves as one product and is ready to wire to your own data.","productSlugs":["halden","fernly","coterie","wharf","ledge","tandem","solum","parley","rapport","sprig","mender","accord","tend","corbel","lintel","hearth","torque","pane","ivora","cadra","tavola","lumora","sunrow","vessa","noria","mavora","pelago","pembra","kelvo","folka","selvar","petalo","olvara","ondra","ambrel","tessly","solvik","kerfa","moorly","wynlo","merrin"],"packDiscount":25,"position":40,"published":true,"updatedAt":"2026-10-28T17:00:50.090Z"},{"slug":"saas-dashboards","name":"SaaS & analytics dashboards","tagline":"An AI platform console, live commerce analytics, a marketing board and a fitness tracker.","intro":"Seven dashboards for a software product: Orrery, a ten-screen console for an AI API platform with a streaming playground, request traces, keys and billing; Prism, a single-screen live analytics wall for an online store; Kestrel, an eleven-page marketing dashboard; Stride, a seven-page personal fitness tracker with a workout log that moves every page; Kairo, a six-page revenue analytics app for a subscription business, where picking a metric morphs the whole report and a deal is dragged into Won; Murmura, an eleven-page social media manager for agencies with role-based access, a composer with live previews for eight networks, approvals, a unified inbox and analytics; and Vitrea, a nine-page App Store publishing desk for an iOS studio in liquid glass, with a release board you drag from build to live, a review inbox, subscriber cohorts, product-page tests and payouts. Plain HTML and CSS with JavaScript or TypeScript (Stride with no dependencies, the others with GSAP), ready to wire to your own data.","productSlugs":["orrery","prism","kestrel","stride","kairo","murmura","vitrea"],"packDiscount":20,"position":45,"published":true,"updatedAt":"2026-10-22T18:05:16.540Z"},{"slug":"finance-dashboards","name":"Finance dashboards","tagline":"Money on screen — a trading terminal, a finance tracker, a portfolio and invoicing.","intro":"Every dashboard about money: Fathom, a live trading terminal with eight pages; Rivet, a black-and-neon finance dashboard; Meridian, a portfolio that moves like a single instrument; Coffer, eight pages of invoicing and accounting where recording a payment stamps the invoice PAID; Rivolo, an eleven-page money app for freelancers with every pot on one bar, safe-to-spend shown as its sum, a two-sided money-flow chart and a tax set-aside on every client payment; Kesta, a ten-page production-finance app for a film studio with a cash-bridge waterfall, four currency wallets and budgets per production; Tillo, a ten-page money app for a bike shop with a cash-flow chart you drag across to total any run of months, a three-step send flow and cards that frost and turn over; Kofra, an eleven-page business bank account for a ceramics studio with a balance runway that forecasts 30 days, invoices that stamp PAID and feed a tax jar, and a hold-to-send payment flow; Sovra, an eleven-page business bank account for a florist with a cash-flow chart you drag across to total any stretch, team cards that frost when frozen and a VAT return worked out against its pot; Kinby, a ten-page family money app with a swipe-carousel wallet of everyone's cards, kids' cards on weekly limits, a bills calendar with paydays and goals that fill as jars; Obolo, a thirteen-page business-finance app for an olive-oil exporter with four currency wallets, a money in and out chart, a live converter and invoices that stamp PAID; Grista, an eleven-page business bank account for a three-shop bakery with its cash drawn day by day, the big days pinned and a year you drag through, team cards that lock with a padlock and a what-if cash forecast; Orvel, a twelve-page finance console for a vinyl pressing plant with every payment drawn as a dot you brush to filter the ledger, a review queue dealt as a stack, invoices that stamp PAID and bills that take two sign-offs; Corvane, an eleven-section payments operations portal for a card processor with a threshold lab you drag across last month's risk scores, a review queue for held payments, a disputes board, payouts and an audit log of every action; Rivlet, a twenty-five-page finance and HR back office for three climbing gyms with a sort desk you drag card charges into their categories on, cash across four accounts, cards that freeze, a profit and loss statement and tax filings that pay from the reserve; Kinlo, an eleven-section finance and HR back office for a two-site cinema with takings by tickets, bar and hire that morph between ranges, card payments filed in bulk, invoices that stamp PAID, a VAT return and a pay run you approve and pay; Coffra, a twenty-four-page finance and people back office for three climbing gyms with a cash-flow chart that morphs between ranges and gyms, a month-end close that ticks itself, transactions filed by suggestion, cards that frost when frozen and a pay run you approve; Ledra, an eight-section money, people and paperwork back office for a landscape architecture studio with a cash chart whose three-month forecast four what-if switches reshape, card charges you drag into their categories, invoices that stamp PAID, bills you approve and pay and a four-step pay run; Covry, an eleven-section money and people back office for a group of veterinary clinics in frosted glass, with a cash chart that morphs between months, weeks and one clinic, card payments you file from a stack with always-file rules, invoices that stamp PAID, a pay run you approve and contracts signed on a drawn pad; and Talvo, a thirteen-page business-finance app for a craft brewery with a 90-day cash forecast you drag bills and invoices across, bills that stamp PAID and a treasury ladder. Calm, transform-only motion, ready for your own numbers.","productSlugs":["fathom","rivet","meridian","coffer","rivolo","kesta","tillo","kofra","sovra","kinby","obolo","grista","orvel","talvo","corvane","rivlet","kinlo","coffra","ledra","covry"],"packDiscount":20,"position":50,"published":true,"updatedAt":"2026-10-26T17:03:27.207Z"},{"slug":"dashboard-starter","name":"Dashboard starter","tagline":"Two dashboards to start with — a portfolio and a finance tracker.","intro":"The two lighter dashboards together: Meridian, a portfolio that moves like a single instrument, and Rivet, a black-and-neon personal finance dashboard. Each is plain HTML, CSS and JavaScript, ready to wire to your own data.","productSlugs":["meridian","rivet"],"packDiscount":15,"position":60,"published":true,"updatedAt":"2026-10-06T14:54:14.588Z"},{"slug":"landing-pages","name":"Product landing pages","tagline":"One-page sites that sell a single thing beautifully.","intro":"Scroll-driven one-page sites for a product or a studio: fresh mangoes, dark chocolate, sneakers, headphones, an architecture coverflow, a synthwave gallery, a quiet audio brand, an architecture studio, a car-rental page where the hero car is the control, a real-estate agency page whose hero film plays as you scroll a homebuying page with a working cash-back calculator and an art marketplace whose wall of art fans out and folds into a portrait wall. Rebrand one, launch it.","productSlugs":["mango","nero","sneakers","vanta","monolith","moonart","solace","vesper","strada","arden","dwella","gesso"],"packDiscount":25,"position":70,"published":true,"updatedAt":"2026-10-15T06:17:54.630Z"},{"slug":"playful-pages","name":"Games & playful pages","tagline":"A shooting range, a deadline that chases you, a studio intro.","intro":"Three one-pagers built to be played with: a neon shooting range where you hit to level up, a deadline timer that comes for you, and a studio intro for websites, apps and stores.","productSlugs":["gungame","deadline","intro"],"packDiscount":15,"position":80,"published":true,"updatedAt":"2026-10-06T14:54:19.817Z"},{"slug":"love-celebrations","name":"Love & celebrations","tagline":"Little animated gifts — birthdays, anniversaries, a love letter.","intro":"Pages made to be sent to someone: a pixel-art love letter, a birthday film, candles to blow out, a long-distance date, a heart built from a thousand \"i love you\"s. Personal, playful and easy to make your own.","productSlugs":["love-letter","love","birthday","date","posy","wish","heartcode","pulse","aurelia"],"packDiscount":25,"position":90,"published":true,"updatedAt":"2026-10-13T06:28:29.740Z"},{"slug":"404-pages","name":"404 pages","tagline":"Lost pages that make people smile instead of leave.","intro":"Not-found pages that keep visitors around: a magnifying glass on your cursor, weather that leaks into the room, an astronaut adrift. One of them is free.","productSlugs":["sleuth","nought","caveman"],"packDiscount":20,"position":100,"published":true,"updatedAt":"2026-10-06T14:54:19.206Z"},{"slug":"every-button","name":"Every button","tagline":"Every button in the store — delete, send, share, download, upload and toggles.","intro":"The complete button set: the delete buttons, the send and share buttons, the download and upload buttons, and the buttons and toggles — every one in the store, in one download, at the biggest saving.","productSlugs":["gulp","dart","parachute","decant","lumen-toggle","gild","glyph","swell","relief","maw","caustic","delete","contrail","plume","splay","nimbus","nudge","bead","brim","ripcord","silo","thrum","tide","keel","plimsoll","quench"],"packDiscount":25,"position":110,"published":true,"updatedAt":"2026-10-13T06:28:32.487Z"},{"slug":"buttons-toggles","name":"Buttons & toggles","tagline":"Toggles that fill, stars that mint, buttons that grow into controls.","intro":"Everyday controls with a flourish: a toggle that fills instead of lighting up, a theme toggle the new light floods out of, a favourite button that mints its own star, buttons whose label is the moving part, a liquid hover, and soft-UI buttons that grow into their own controls.","productSlugs":["decant","lumen-toggle","gild","glyph","swell","relief"],"packDiscount":20,"position":120,"published":true,"updatedAt":"2026-10-13T06:28:31.876Z"},{"slug":"download-upload-buttons","name":"Download & upload buttons","tagline":"Progress you can watch — liquid fills, unrolling rings, a parachute.","intro":"Buttons that turn waiting into something to watch: the outline becomes the progress bar, the arrow becomes the water, a glass fills, a parachute drops the file. Download, upload and submit — each one shows its progress in a different way.","productSlugs":["parachute","bead","brim","ripcord","silo","thrum","tide","keel","plimsoll","quench"],"packDiscount":20,"position":130,"published":true,"updatedAt":"2026-10-06T14:54:14.894Z"},{"slug":"send-share-buttons","name":"Send & share buttons","tagline":"Send, subscribe, share, publish — each with a flourish.","intro":"The buttons people press to reach someone: a send that folds into a paper plane, a subscribe that flies off, a share that fans into channels, a publish that rolls its own weather, a contact button that reacts when poked.","productSlugs":["dart","contrail","plume","splay","nimbus","nudge"],"packDiscount":20,"position":140,"published":true,"updatedAt":"2026-10-06T14:54:17.345Z"},{"slug":"delete-buttons","name":"Delete buttons","tagline":"Buttons that make deleting feel final — and fun.","intro":"Delete, but memorable: the bin eats the label, the paper crumples and flies, the button dissolves what it swallows. Each one confirms the action without a single extra dialog.","productSlugs":["gulp","maw","caustic","delete"],"packDiscount":20,"position":150,"published":true,"updatedAt":"2026-10-06T14:54:17.039Z"},{"slug":"cart-checkout","name":"Cart & checkout","tagline":"Add-to-cart, pay and checkout moments that sell.","intro":"The moments that close a sale: an item that hops into a cart that comes for it, a pay button that looks at you, a card that swipes through, a checkout where the card is the form — plus two shop pages to put them in.","productSlugs":["caddy","cart","dash","depot","glance","tender","sable","atelier","sola","dispatch"],"packDiscount":20,"position":160,"published":true,"updatedAt":"2026-10-06T14:54:17.651Z"},{"slug":"navbars","name":"Navigation bars","tagline":"Tab bars and docks that stretch, glow and flow.","intro":"Bottom navs, tab bars and docks where the indicator is the show: a drop of liquid, an electric arc, a filament of light, a word that becomes the dock.","productSlugs":["meniscus","lucid","crest","surge","opal","arc","relay"],"packDiscount":15,"position":170,"published":true,"updatedAt":"2026-10-07T15:58:11.316Z"},{"slug":"otp-codes","name":"OTP & verification codes","tagline":"One-time code fields that make verifying a moment.","intro":"Verification codes with a twist: digits dealt as cards, a code pressed into obsidian, a safe that dials open, a key that gets cut, a field that seals itself.","productSlugs":["sigil","quarto","deck","gyre","signet","spindle","tumbler"],"packDiscount":25,"position":180,"published":true,"updatedAt":"2026-10-13T06:28:31.266Z"},{"slug":"mobile-interactions","name":"Mobile app interactions","tagline":"Chat, swipes and onboarding that feel native.","intro":"The moments a mobile app is judged by: messages delivered by tube, a composer whose tray swings out, an iOS list row that shreds, and a crypto wallet onboarding in one continuous shot.","productSlugs":["tube","pivot","swipe","keep"],"packDiscount":20,"position":190,"published":true,"updatedAt":"2026-10-13T06:28:30.657Z"},{"slug":"inputs-feedback","name":"Inputs & feedback","tagline":"Sliders, ratings, search and uploads people enjoy using.","intro":"Input and feedback controls with personality: a spice slider whose pepper catches fire, a loudness slider, a rating face that feels it, a search icon that opens into the field, a file upload you can actually ship, and a loader where the last bead jumps to the front.","productSlugs":["scoville","decibel","mood","scry","upload","hop"],"packDiscount":20,"position":200,"published":true,"updatedAt":"2026-10-06T14:54:17.964Z"},{"slug":"playful-scenes","name":"Playful scenes","tagline":"Little worlds to play with — a dragon egg, a snow globe, four seasons.","intro":"Interactive scenes that make a page memorable: hatch a dragon, shake a snow globe, turn one tree through four seasons, tap a day to change the sky, wake a lamp, steer a reptile cursor, and read the time off a brass spider.","productSlugs":["ember","snowglobe","solstice","weather","lamp","reptile","arachne"],"packDiscount":25,"position":210,"published":true,"updatedAt":"2026-10-06T14:54:18.887Z"},{"slug":"cards-sections","name":"Cards & sections","tagline":"Team, product and feature sections that move.","intro":"Three page sections: a team grid with one person in colour at a time, a cola card that unfolds when you tap the can, and a product card for sound, elevated.","productSlugs":["atlas","axis","halo"],"packDiscount":15,"position":220,"published":true,"updatedAt":"2026-10-06T14:54:19.511Z"}],"trending":[{"slug":"sleuth","people":11},{"slug":"murmura","people":7},{"slug":"pane","people":4},{"slug":"pebble","people":4},{"slug":"kinlo","people":3},{"slug":"vessa","people":3},{"slug":"accord","people":3},{"slug":"tend","people":3}],"picks":[{"slug":"sleuth","people":117},{"slug":"rapport","people":46},{"slug":"pane","people":23},{"slug":"fernly","people":23},{"slug":"coterie","people":12},{"slug":"wharf","people":10},{"slug":"murmura","people":8},{"slug":"parley","people":8},{"slug":"accord","people":7},{"slug":"halden","people":7},{"slug":"vessa","people":6},{"slug":"mender","people":5},{"slug":"corbel","people":5},{"slug":"tend","people":5},{"slug":"pebble","people":5},{"slug":"orrery","people":5},{"slug":"sprig","people":5},{"slug":"scry","people":5},{"slug":"sigil","people":4},{"slug":"verso","people":4},{"slug":"kvist","people":4},{"slug":"rivet","people":4},{"slug":"kinlo","people":3},{"slug":"arc","people":3},{"slug":"bead","people":3},{"slug":"tandem","people":3},{"slug":"meniscus","people":3},{"slug":"kestrel","people":3},{"slug":"kerfa","people":2},{"slug":"ivora","people":2},{"slug":"noria","people":2},{"slug":"upload","people":2},{"slug":"hearth","people":2},{"slug":"dart","people":2},{"slug":"maw","people":2},{"slug":"gyre","people":2},{"slug":"coffer","people":2},{"slug":"kairo","people":2},{"slug":"tavola","people":2},{"slug":"sunrow","people":2},{"slug":"arden","people":2},{"slug":"contrail","people":2},{"slug":"lumen-toggle","people":2},{"slug":"solum","people":2},{"slug":"norda","people":2},{"slug":"sorrel","people":2},{"slug":"coffra","people":1},{"slug":"obolo","people":1},{"slug":"pelago","people":1},{"slug":"plume","people":1},{"slug":"tessly","people":1},{"slug":"selvar","people":1},{"slug":"vitrea","people":1},{"slug":"cart","people":1},{"slug":"atelier","people":1},{"slug":"mavora","people":1},{"slug":"deck","people":1},{"slug":"tether","people":1},{"slug":"portal","people":1},{"slug":"sable","people":1},{"slug":"lamp","people":1},{"slug":"spindle","people":1},{"slug":"talvo","people":1},{"slug":"ledge","people":1},{"slug":"prism","people":1},{"slug":"cadra","people":1},{"slug":"lumora","people":1},{"slug":"relief","people":1},{"slug":"quarto","people":1},{"slug":"stride","people":1},{"slug":"nimbus","people":1},{"slug":"parachute","people":1},{"slug":"gild","people":1},{"slug":"solace","people":1},{"slug":"mango","people":1},{"slug":"vesper","people":1},{"slug":"quench","people":1},{"slug":"vanta","people":1},{"slug":"gungame","people":1},{"slug":"portfolio","people":1},{"slug":"kessler","people":1},{"slug":"love-letter","people":1},{"slug":"vault","people":1},{"slug":"plimsoll","people":1},{"slug":"glyph","people":1},{"slug":"tender","people":1},{"slug":"hop","people":1},{"slug":"splay","people":1},{"slug":"meridian","people":1}],"testimonials":[]}