
Illustrated Agritech App Landingv1.0.2
Use this Skill to build landing page.
A bright, illustrated multi-page product site: a rounded sky-gradient hero with a flat-vector farm landscape rising from the bottom, a small tilted phone showing the app, colorful tinted feature cards and saturated blue product bands. Inner pages are designed, not stubbed: solution pages with their own interactive widgets, a live platform dashboard, pricing with a hardware estimator, a rule builder, full journal articles and a multi-step sign-up. Every illustration shares one art direction, so the site looks drawn by one hand.
Picked most often by
Updated Oct 3, 2026
Preview gallery
Runs in
Generates with
Similar Skills
View all skillsWhat you get
- A complete website in one self-contained HTML file that opens offline; the Haywren example has 25 connected routes, from solutions and pricing to journal, about, contact and legal pages
- Working tools: an interactive field dashboard, a widget on every solution page, a billing toggle and hardware estimator, an automation rule builder and a multi-step sign-up
- One flat-vector illustration style for every image, a live phone mockup, Bricolage Grotesque, Figtree and Geist Mono type, and a port into your own framework on request
Good fit
- Agritech, food, garden, outdoor and field-service products that want a friendly illustrated look instead of stock photography
- App makers who need a full page family (solutions, pricing, journal, about, download) rather than a single landing page
- Teams who want a standalone site now, or the same design built in Vue, React, Astro or Next.js
Not for
- A ready-made backend: sign-up, contact and app-link forms confirm on the page but send, create and charge nothing
- Brands that need photography: every image follows one flat vector illustration style
- Projects that want a different visual direction: the sky shell, landscape band, phone mockup and blue bands are the design
About this Skill

Describe your product and its pages, and get back a complete illustrated website: a rounded sky-gradient hero with a farm landscape rising from the bottom, a small tilted phone showing the app, colorful feature cards and saturated blue product bands. It arrives as one self-contained file that opens in any browser and works offline.

What you get
- A full page family: home, platform, solution pages, automation, pricing, journal and articles, about, contact, app download, sign-up, privacy, terms and a designed 404
- Inner pages with real tools: a field dashboard with range switches, a widget on each solution page, a hardware estimator and an automation rule builder
- One flat vector illustration style across every slot, with app screens drawn as live interface on the phone
- Filters, search, carousels and forms that validate and confirm, with calm motion that respects reduced-motion settings
- On request, the same design built as components and routes in your own stack

How to use it
- Share your brand, audience, products or solutions and the pages you need; rough notes are enough, and drafted facts are listed for you to confirm
- Provide illustrations you own, or let it generate a matching set with one subject per slot
- Open the finished file in your browser, click through every page and ask for changes in plain words

New illustrations are generated with your agent's image tool, which may carry that tool's usage charges. Fonts and images are embedded in the finished file.
What you need before you start
- You bring
- Brand name, audience and a short introduction to the product · Products, solutions or stories with useful descriptions, and the pages you need · Illustrations you own, or permission to generate a new matching set
- 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 generation tool in your agent, or illustrations you own, for the product-specific artwork
- Outside costs
- New illustrations are generated with your agent's own image tool, which may incur that tool's usage charges. Illustrations you own cost nothing, and the example's neutral farm scenery can be reused for rural, food or outdoor brands.
- Last tested
- v1.0.2 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
User reviews
Loading reviews…









