Loopwise SaaS Landing
+6Liquid Glass Landingv1.0.3
Use this Skill to build website page.
Rising
5.016 downloads0 likes0 saves
$4.99
What do I get when I buy this Skill?Build a dark, frosted-glass landing page with a cinematic hero, a focused email capture and a restrained editorial story. Glass pills catch light at their rims over a near-black ground, an oversized serif headline carries one italic word, and the product appears as a live email preview with a chart. Pricing, FAQ, a closing capture and pages for a sample edition, archive, charter, join, sign-in and legal follow. By default it is one self-contained file that opens offline.
Picked most often by
Updated Oct 3, 2026
Similar Skills
View all skills+6
What you get
- A landing page with about a dozen sections for the fictional Nightfold, from the glass hero and live email preview to pricing, FAQ, closing capture and a ghost-wordmark footer.
- Seven routes: a sample edition with paywall, an archive with search and filters, charter, join, sign-in, privacy and terms, and a designed 404.
- Working capture forms, inbox picker, monthly or yearly pricing with a seat stepper, reader-notes carousel and countdown, with four typefaces embedded in one offline file.
Good fit
- Newsletters, waitlists, private betas and launch campaigns where the main job is collecting email addresses.
- Founders who want the black-glass look without tuning blur, borders and highlights by hand.
- Products that can be shown as a real screen, such as an email, an app view or a changelog, rather than a stock photo.
Not for
- Bright, colourful or illustration-led brands; the design is dark only, with no accent colour.
- Sending real emails out of the box: capture, join and sign-in forms confirm in the page until you connect your mailing service.
- Large content sites with many navigation levels; this is a conversion page with a few supporting routes.
Product Launch & App GrowthDigital Publications & Web PagesBuild Website PageBuild Landing PageStyle-lockedConversion-focusedCinematicGlassmorphismDark MonochromeLiquid GlassSerif Display
About this Skill
Turn a name and one promise into a dark landing page that feels like frosted glass over a film: glass pills that catch light, a huge serif headline with one italic word, and an email capture front and centre. The worked example is the fictional newsletter Nightfold, with a live email preview, membership pricing and seven working routes. The default result is one self-contained file that opens offline in any browser.
What you get
- A glass pill header, a cinematic hero with email capture, a live email preview with chart, a facts strip and a method split
- An editions picker, editors, reader notes, membership pricing with a monthly or yearly toggle, recent editions, FAQ and a closing capture with countdown
- Sample edition, archive, charter, join, sign-in and legal pages, plus a designed 404
- Instrument Serif, Newsreader, Geist and Geist Mono embedded, with zero network requests
How to use it
- Share your name, what the product is, what signing up gets people, the cadence, prices and the people behind it.
- Your agent fills the sections, renders your product as a live screen in the glass panel and creates dark images or uses your hero footage.
- Open the page, try the capture forms, pricing toggle and archive filters, then ask for changes.
Generated images may incur your image tool's usage charges. The forms confirm in the page and send nothing until you connect your own mailing service.
What you need before you start
- You bring
- Name, what the product is and what signing up gets the visitor · Cadence or launch date, prices or tiers, a few honest facts and the people behind it · Optional: your own dark hero footage and team photos
- 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 · Optional: an image generation tool in your agent; without one, media frames get dark placeholder surfaces
- Outside costs
- Generating the dark images with your agent's image tool may incur that tool's usage charges. Without an image tool the page still builds, with dark placeholder surfaces in each media frame.
- Last tested
- v1.0.3 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
User reviews
Loading reviews…