Skip to content

wiremd Documentation

Welcome to the wiremd documentation! wiremd is a text-first UI design tool that lets you create wireframes and mockups using Markdown syntax.

What is wiremd?

wiremd is a markdown-based UI wireframing tool that lets you create wireframes and mockups using familiar markdown syntax with intuitive extensions. Write your UI designs as text, render them as beautiful wireframes.

Key Features

  • Markdown-first - Valid markdown that degrades gracefully
  • Visual syntax - Looks like what it renders
  • Fast to write - Intuitive shortcuts for common patterns
  • Extensible - Add classes and attributes as needed
  • Multiple outputs - HTML, JSON, and framework components
  • Multiple styles - Balsamiq-style, clean, wireframe, and more

Quick Example

markdown
## Contact Form

Name
[_____________________________]{required}

Email
[_____________________________]{type:email required}

[Submit]{.primary} [Cancel]

This renders into a styled wireframe with a form, inputs, and buttons.

Getting Started

  1. Install wiremd
  2. Learn the syntax
  3. Explore examples
  4. Read the API docs

Community

License

wiremd is open source software licensed under the MIT License.

Released under the MIT License.