WireDSL

Spec sheet

Purpose

Wire-DSL is a declarative, block-based language for creating interactive wireframes with code.Read 9 Oct 2026 · wire-dsl.org

Intended users

The project presents dashboards, forms, and design systems as use cases and provides a code-first workflow for building wireframes.Read 9 Oct 2026 · wire-dsl.org

Integrations

The project describes GitHub version-control workflows and an MCP server at mcp.wire-dsl.org/mcp.Read 9 Oct 2026 · wire-dsl.org

Support

The site points users to documentation, GitHub issues, discussions, and a contributing guide for community support.Read 9 Oct 2026 · wire-dsl.org

License

The official site says Wire-DSL is open source; its GitHub repository identifies the license as MIT.Read 9 Oct 2026 · wire-dsl.org

Accessibility

The project describes built-in accessibility best practices as a design feature.Read 9 Oct 2026 · wire-dsl.org

Accessibility and AI

The project describes built-in accessibility practices and syntax designed to support generating wireframes from natural-language prompts.Read 9 Oct 2026 · wire-dsl.org

AI integration

The MCP server supports Claude Desktop, ChatGPT, Cursor, and Windsurf, with tools for documentation, validation, and rendering.Read 9 Oct 2026 · wire-dsl.org

CLI

The CLI can validate and render .wire files and is installable from npm as @wire-dsl/cli.Read 9 Oct 2026 · wire-dsl.org

Components

The documentation lists 30 built-in components covering text, inputs, buttons, navigation, data, media, and other interface elements.Read 9 Oct 2026 · wire-dsl.org

Editor extension

The site lists a VS Code extension with syntax highlighting and IntelliSense.Read 9 Oct 2026 · wire-dsl.org

Editor limitation

The web editor is code-driven, its preview is limited to standard screen sizes, and wireframes with 100 or more components may slow down preview.Read 9 Oct 2026 · wire-dsl.org

Exports

Wire-DSL can render wireframes to SVG, PNG, and PDF.Read 9 Oct 2026 · wire-dsl.org

Hosted MCP

The public MCP server requires no installation or authentication, and the documentation also describes self-hosting it.Read 9 Oct 2026 · wire-dsl.org

Layouts

The five documented layout containers are Stack, Grid, Split, Panel, and Card.Read 9 Oct 2026 · wire-dsl.org

Limit

The web editor documentation says very large wireframes with 100 or more components may slow down the preview.Read 9 Oct 2026 · wire-dsl.org

Version control

The documentation describes the code-first workflow as version-control and diff friendly, and lists GitHub integration as version-control ready.Read 9 Oct 2026 · wire-dsl.org

VS Code

The project documents a VS Code extension with syntax highlighting, error detection, autocomplete, formatting, and a live preview pane.Read 9 Oct 2026 · wire-dsl.org

Web editor

The browser-based editor provides live preview, real-time validation, and SVG or PNG export without installation.Read 9 Oct 2026 · wire-dsl.org

Plans and prices

Every WireDSL plan and price →

Where Specifiction places it

• AI Wireframe Generators#21 of 348.0