Magnetic Lattice Hero
+6Lumen Agency Landingv1.0.3
Use this Skill to build website page.
Rising
5.015 downloads1 likes0 saves
$4.99
What do I get when I buy this Skill?A bright, specific agency page that sells a studio's craft through evidence: a quiet centered hero with one teal-to-blue gradient on the words that matter, then selected work where each project pairs a photo of the client's world with a browser window of the product the studio built. Client quotes on a crosshair grid, six services cards, a clear process with honest prices, the team, FAQ and one dark contact panel with a working enquiry form complete the page.
Picked most often by
Updated Oct 3, 2026
Similar Skills
View all skills+6
What you get
- A complete agency one-pager in one self-contained HTML file that opens offline, with case studies and legal text opening in dialogs instead of separate pages
- A Recent Work showcase with category filters and counts, an archive list, and case studies that open with the brief, the build, three stats and a client quote
- Six services cards, process steps with week ranges, engagement models with prices, team, FAQ, and an enquiry form that validates and shows a success summary
Good fit
- Design and development studios, freelancers and small consultancies selling craft through selected work and client proof
- Teams refreshing a hire-us page that needs real project numbers, prices and a clear way to get in touch
- Practices that want one bright page to share, or the same design built in their own Next.js, Vue, Svelte or Astro project
Not for
- SaaS product pages organized around feature grids and plan tables; a SaaS landing Skill fits better
- Brands that want a dark, moody or maximalist look: the page stays light, with one dark contact panel and no dark mode
- Multi-page sites with a blog or CMS: this is a deliberate one-pager with dialogs for case studies and legal text
Brand IdentitySales Proposal & FundraisingDigital Publications & Web PagesBuild Website PageBuild Landing PageStyle-lockedEditable OutputBright White MinimalGradient Accent TypographyGrid Pattern GroundsPlayful ProfessionalPortfolio Showcase Rows
About this Skill
Tell it your studio's name, a few projects and what you sell, and it returns a bright agency page: white ground, one teal-to-blue gradient on the headline words that matter, and your work shown as a photo of each client's world beside a browser window of the product you built. It arrives as one self-contained file that opens in any browser and works offline.
What you get
- A full one-pager: hero, client quotes, Recent Work with filters and an archive, services, process, engagement prices, team, FAQ and a dark contact panel
- Case studies that open in place with the brief, what was built, three stats and a client quote
- An enquiry form that validates, shows a loading state and confirms with a summary, plus a newsletter and a copy-email button
- Bricolage Grotesque, Instrument Sans and Geist Mono embedded, with calm reveals and a mint wash that follows the cursor across the services cards
- Inside your own codebase, the same page built as components in your stack
How to use it
- Give it your studio name, a one-line promise, two to four projects with an outcome each, and your services; rough notes are enough
- Attach client photos and portraits if you have them; otherwise they are generated, and each project window is rebuilt from your project's data
- Open the finished file in your browser and ask for copy, project or pricing changes in plain words
Generated photos use your agent's image tool and may carry that tool's usage charges. Fonts and images are embedded, so the finished file makes no network requests.
What you need before you start
- You bring
- Studio name, one-line promise and three capabilities · 2-4 showcase projects with an outcome number, plus six services and your process or prices · Optional: testimonials, client photos, a team photo and contact details
- 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 for client, portrait, team and process photos
- Outside costs
- Client-world photos, portraits, the team photo and the process detail are generated with your agent's own image tool when you do not supply them, which may incur that tool's usage charges. Testimonials without a portrait fall back to monograms.
- Last tested
- v1.0.3 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
User reviews
Loading reviews…