Tools· Design & Creative

    Tailark

    Open source registry of 200-plus shadcn/ui blocks for marketing websites across three design kits, installable via CLI or by prompt through a dedicated MCP server.

    designingexecutableFreemium

    Description

    Strengths

    Extensive block catalog
    Over 200 blocks across more than 30 categories, from 16 hero variants to pricing tables, comparison tables, FAQs, footers, bento layouts, and team pages.
    Three design kits
    Mist, Dusk, and Veil offer the same block catalog in different visual languages, selectable depending on the desired look.
    CLI installation through the shadcn registry
    Blocks can be added directly to a React project via a shadcn CLI command under the "@tailark" namespace.
    MIT-licensed core catalog
    The block set included in the repository is released under the MIT license, open for commercial and private projects.
    Visibility in the shadcn ecosystem
    With more than 2,000 stars on GitHub, Tailark is one of the better-known free block registries for shadcn/ui.

    Assessment

    AI features

    • MCP server for AI assistants A configurable MCP server makes the block catalog searchable for AI tools and can be driven by prompt.
    • Prompt-based block search Through the MCP server, individual blocks can be found via natural-language prompts, for example a matching hero section from the registry.
    • Prompt-based page assembly More complex requests, such as assembling a complete pricing page from several blocks, can also be delegated to an AI tool through the MCP server.

    Suitable for

    • React projects in the shadcn/ui ecosystem that want to reach finished marketing pages quickly, without designing every section from scratch
    • Teams that want to equip several marketing landing pages with a consistent, polished look, using one of the three design kits as a style guideline
    • AI-assisted frontend workflows that want to pull in blocks directly from a prompt through the MCP server
    • Less suitable for Less suitable for projects outside the React ecosystem, where the blocks can only be read as a structural template and have to be manually ported to the target language

    Limitations and notes

    • React requirement Every block is a React component with Tailwind classes, other frameworks require a manual port of the structure.
    • Paid extensions Alongside the open repository, tailark.com offers additional, paid block packages that are not part of the MIT-licensed base.
    • One kit per project Mist, Dusk, and Veil are independent style lines of the same catalog; mixing several kits in the same project leads to visual inconsistency.
    • Exact block names needed The documentation advises copying the CLI install command directly from the relevant block or category page instead of guessing block names.

    Quick start

    1. Add the Tailark registry namespace to your own shadcn project's components.json.
    2. On tailark.com, pick a design kit, Mist, Dusk, or Veil, and the matching blocks.
    3. Copy the CLI install command from the relevant block or category page, for example `npx shadcn@latest add @tailark/<block>`.
    4. Run the command in your own project, review the block, and adjust the design tokens to your own brand.
    5. Optionally set up the MCP server to find and add blocks by prompt from an AI tool going forward.

    Tips

    • Pick a kit before adding the first block and stick with it; switching later means rework across every section already built in.
    • Always copy CLI commands from the current block page rather than from memory, since block names differ between categories.
    • For projects outside React, read the blocks only as a layout reference and rebuild the structure deliberately, rather than expecting a direct port.
    • Use the MCP server to have several matching blocks suggested for a page at once, instead of browsing every category individually.

    Access

    Last reviewed: · Pricing, plans and features are a snapshot in time. Check the provider's own page before deciding.

    In the workshop this becomes your method.

    Whoever sees this process run once wants the agent behind it next. We build that in the workshop From Process to Agent.

    View workshops

    Related resources

    Browse all resources

    Conversation, not pitch

    Understand first, then decide. We take time for an initial conversation, without sales pressure, without obligation.

    Schedule a call