website designer skill

    1

    A structured website planner and design consultant that generates complete site architectures and design systems.

    $9

    Secure checkout via Stripe

    30-day refund guarantee

    Converts to your local currency at checkout

    Security scanned

    Works with the AI tools you already use

    Claude CodeClaude CodeCursorCursorCodex CLICodex CLIMuseMuseDotsDots+22 more

    website designer skill

    Example session with this skill installed

    I need to plan a website for my boutique coffee roastery. We sell organic beans and want customers to subscribe. I like a clean, earthy vibe but with modern typography.

    • Read your context and instructions
    • Compiled the website designer
    • Generated the app files

    I'll help you plan your website from the ground up. Let me learn about your business and what you're going for, and I'll put together a complete plan.

    Website Strategy & Design Plan: Artisan Roast Boutique

    This plan focuses on driving subscription conversions while maintaining your earthy, modern aesthetic.

    Recommended Pages

    1. Homepage — High-impact hero section, "How it Works" for subscriptions, and featured roasts.
    2. Shop/Subscriptions — Tiered pricing for bean delivery with filterable roast profiles.
    3. Our Story — Direct trade transparency and roasting process to build brand authority.
    4. Brew Guides — Value-add content to encourage repeat visits and SEO.

    Design Direction: "Modern Organic"

    ElementSpecificationUsage
    Primary Color#3E2F28 (Deep Espresso)Headings, Primary CTAs
    Secondary Color#F5F2ED (Oatmeal)Main background sections
    Accent Color#8A9A5B (Sage Leaf)Subscription highlights, Hover states
    Text Color#2C2C2C (Charcoal)Body copy and paragraphs
    Heading FontMontserrat (Bold, 700)Modern, clean architectural feel
    Body FontLora (Regular, 400)Elegant serif for readability and warmth

    Content Direction (Homepage)

    • Hero Section: Lead with the "Farm to Cup" transformation. Focus on freshness.
    • Social Proof: Display badges for "Certified Organic" and customer quotes.
    • Subscription Section: 3-step visual guide (Choose your bean -> Pick frequency -> Enjoy).

    Next steps

    1. Download the generated HTML Website Plan for your developer.
    2. Review the color palette to ensure it matches your physical packaging.
    3. Would you like me to create a detailed section-by-section mockup for the Homepage?

    website-designer-skill-app.zip

    ZIP · project files

    Generated

    Example file from a real run - the skill writes it into your workspace.

    Connects securely to your tools. The creator never sees your data.

    What you get

    Draft a complete site map and page hierarchy for a new business.Define a cohesive brand color palette and typography system.Create content blueprints to guide copywriters and developers.Generate a portable brief to ensure design consistency across teams.

    About this skill

    The problem

    Planning a website is overwhelming. Most people dive into builders without a strategy, resulting in messy navigation, confusing messaging, and inconsistent design that fails to convert.

    What it does

    • Conducts a targeted multi-round consultation to extract your business goals and style preferences.
    • Architects a strategic page list with defined purposes for each URL.
    • Provides section-by-section content direction for every page to guide your copy and layout.
    • Develops a full design system including hex codes, font pairings, and visual style notes.
    • Generates a portable HTML Website Plan document for developers or future AI prompts.

    Why this beats prompting it yourself

    This skill follows a structured architectural process that a standard LLM often skips. It enforces a logic-first approach, ensuring your design choices support your business goals rather than just "looking cool."

    Use cases

    • Building a high-conversion landing page for a new product launch.
    • Planning a professional portfolio that balances personality with credibility.
    • Briefing a web developer with precise technical and design requirements.
    • Modernizing an outdated business site with a fresh strategy and design system.

    Known limitations

    This skill focuses on strategy and design direction. It does not write final production copy, write functional code, or generate image assets.

    How to install

    Works the same in every agent - Claude, Cursor, Codex, Copilot and 20+ more.

    ~30 seconds
    1. 1

      Download the ZIP

      Free skills download straight away. Paid skills unlock right after purchase.

    2. 2

      Unzip into your skills folder

      Every agent reads skills from one folder on your machine. Drop the unzipped folder in there.

    3. 3

      Ask your agent to use it

      Restart the agent if it was already running. It picks the skill up automatically - no config needed.

    Skills folder by agent

    Click the path to copy it. Create the folder if it does not exist yet.

    Reviews

    No reviews yet

    Be one of the first to try it. Every listed skill passes our trust checks below.

    Security scanned

    Passed our 8-point scan before listing

    Fresh listing

    Recently published to Agensi

    30-day refund

    Not a fit? Get your money back

    Trust & safety

    Security scanned

    Verified clean 13 days ago

    • Passed all security checks, Safe to install

    Listed13 days ago

    What's inside

    Frequently Asked Questions