Skip to content

WireweaveAI-powered wireframes, anywhere

Editor, Cursor, Claude Code, CLI — write once, refine everywhere.

Wireweave

See It in Action

From simple code to beautiful wireframes in seconds

Login Form Wireframe
Login Form
Simple authentication UI
page "Login" centered {
  card w=360 p=6 shadow=lg {
    title "Sign In" level=2
    input "Email" inputType=email
    input "Password" inputType=password
    button "Sign In" primary w=full
    link "Forgot password?"
  }
}
Social Media Feed Wireframe
Social Media Feed
Instagram-like mobile layout
page device=mobile {
  header p=3 border {
    row justify=between {
      icon "instagram" size=lg
      row gap=3 {
        icon "heart"
        icon "message-circle"
      }
    }
  }
  main { ... }
  footer p=3 border { ... }
}
Dashboard Wireframe
Dashboard
Analytics admin panel
page "Dashboard" {
  header p=4 border { ... }
  row {
    sidebar w=200 p=4 {
      link "Dashboard"
      link "Analytics"
      link "Reports"
    }
    main p=4 gap=4 {
      row gap=4 {
        card p=4 { title "24,521" }
        card p=4 { title "$45,231" }
      }
    }
  }
}
E-Commerce Wireframe
E-Commerce
Product detail page
page "Product" {
  header p=4 border { ... }
  main p=6 {
    row gap=6 {
      placeholder "Image" w=400 h=400
      col gap=4 {
        title "Premium Headphones"
        title "$299.00" level=2
        button "Add to Cart" primary
      }
    }
  }
}

Ready to create your own wireframes?

Released under the MIT License.