← ClaudeAtlas

landing-page-fastlisted

Ship a high-quality landing page in 4-8 hours using Astro + Tailwind + shadcn-style components — opinionated defaults, proven section structures, performance and SEO baked in. Use when launching a new product ([Project A], [Project B]), validating a hackathon idea, refreshing a [Company] product page, or any time the user asks to "build a landing", "make a landing page", "set up a landing for X". Output: a deployed landing page on Vercel with form capture, analytics, and proper meta. Bakes in `frontend-quality` rules.
Xipher-Labs/walter-os · ★ 5 · Web & Frontend · score 67
Install: claude install-skill Xipher-Labs/walter-os
# Landing Page Fast Opinionated landing page production. Decisions made for you. Output: a working, deployed, on-brand page in 4-8 hours, not weeks. This skill bakes in `frontend-quality` rules (a11y, Core Web Vitals, mobile-first) and `web-security-baseline` headers — you don't need to think about them while you build. ## Stack (default — don't deviate without reason) - **Astro** + **Tailwind** + **shadcn/ui-style components** + **Vercel**. - TypeScript strict mode. - `astro:assets` for image optimization. - `astro:transitions` if multi-page (keep it minimal — single-page is faster to ship). When to deviate: - Need auth gates / dynamic per-user content evolving into the full app → use **Next.js 15 App Router** instead of Astro. - Operator already standardized on **SvelteKit** for the project → use that. Do NOT use: WordPress, Wix, raw HTML+JS without a framework, vanilla CSS without Tailwind. Slower to ship, harder to evolve. ## Section structure (proven for B2B/SaaS technical audience) In this order. Skip nothing without explicit reason: 1. **Hero** — headline + subhead + primary CTA + visual 2. **Social proof** — logos, stat banner, testimonial (only if real) 3. **Problem** — what's broken about status quo (you EARN credibility here) 4. **Solution** — how this fixes it (max 3 features) 5. **How it works** — 3-4 steps with diagram or screenshots 6. **Use cases** — 2-3 personas, not more 7. **Pricing** — show prices unless you really can't 8. **FAQ** — 5-8 rea