
Amber Scrapbook Suitev1.0.9
Use this Skill to build website page.
Build the whole surface of a SaaS product in a warm amber scrapbook style: a marketing home page, pricing with a checkout drawer, sign-in and sign-up, a working product view, an admin dashboard, and changelog, contact, legal and not-found pages. Cream paper panels, taped photos, handwritten notes and sticker tiles make the marketing side feel hand-assembled, while the product views stay calm and precise. Plan, credits and user stay in step across every view, delivered as one self-contained file that opens in any browser and works offline.
Picked most often by
Updated Oct 3, 2026
Preview gallery
Runs in
Generates with
Similar Skills
View all skillsWhat you get
- A connected suite: home, pricing with checkout, sign-in and sign-up, the working product, admin, changelog, contact, privacy, terms and a not-found page, sharing one story and one state
- The amber scrapbook look: a minimal centred hero with one amber gradient clause and sticker tiles, then taped photos, handwritten notes, a cream bento grid, a roadmap board and masonry testimonials
- Working interactions in light and dark: task capture with live parsing, a credit-costing plan action, billing toggle, admin search, sort and filters, and a command menu
Good fit
- SaaS, productivity and indie software teams that want a warm, hand-assembled launch site instead of a corporate gradient page
- Founders who need the marketing site, pricing, product and admin mocked up as one convincing demo for a launch or early validation
- Products with a clear core loop (capture, organise, generate a result) that can be shown working inside the product view
Not for
- Formal enterprise or regulated brands: stickers, washi tape and handwritten notes keep the tone deliberately playful
- Live apps with real accounts, payments or data: sign-in, checkout and emails are honest in-page simulations
- Businesses with no software product, such as a café or a portfolio: the suite is built around a product, its pricing and an admin
About this Skill

Amber Scrapbook Suite builds every surface of a SaaS product as one connected set of views: marketing home, pricing, sign-in, the working product, admin and the supporting pages. The marketing side looks hand-assembled with cream paper, washi tape, polaroids and handwritten notes, while the product and admin views stay calm and precise. The example is Dayfold, a fictional AI day planner.

What you get
- A complete suite: home, pricing with a checkout drawer, sign-in and sign-up, the product, admin, changelog, contact, privacy, terms and a not-found page
- A home page that runs from the minimal hero through a wordmark marquee, feature splits with tilted cards and taped photos, a cream bento grid, a customer story, a roadmap board, masonry testimonials, an FAQ and a notepaper sign-off
- A product view with natural-language task capture and a plan action that costs credits, plus an admin dashboard with stats, a chart and a searchable users table
- Shared state: signing up or buying a plan updates the account menu, credits, the pricing badge and the admin table
- Light and dark themes, a command menu, and one self-contained file that opens in any browser and works offline

How to use it
- Share your product name, a one-line promise, 8 to 10 features with the 3 flagship ones marked, your pricing shape and a few roadmap items.
- Your agent maps the product loop to your domain, plans and generates the photos, and builds every view with your copy.
- Open the file, click through each page in light and dark, then ask for changes to copy, plans or sections.

Photos come from your agent's image tool when one is available, which may carry that tool's usage charges. Anything your brief leaves out becomes placeholder copy that the agent lists for you to confirm.
What you need before you start
- You bring
- Product name, a one-line promise and the audience · 8 to 10 features with the 3 flagship ones marked, plus your pricing shape · Roadmap items, a customer story and any real quotes or photos (optional)
- Dependencies
- Node.js 18 or newer on your agent's machine, to run the bundled script that builds the single offline file · Internet access while the file is built, so the fonts can be downloaded once and embedded · An image tool in your agent for the photos (optional; without it you supply photos or get labelled placeholders)
- Outside costs
- Photos are generated with your agent's own image tool when one is available, which may incur that tool's usage charges. Without one, the agent asks for your photos or ships clearly labelled placeholders. Nothing else uses a paid service.
- Last tested
- v1.0.9 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
User reviews
Loading reviews…








