Build Diagrams at the Speed of Thought
A professional designer tool that merges a simple layout code (DSL) with a paper-like visual canvas. Create architecture diagrams, flows, and mind maps in seconds.
Design Anything In Seconds
Toggle through the visual showcases of various diagram styles supported natively in DPad.
rect app_servers {
name: "App Servers"
}
rect db_primary {
name: "Primary Database"
}
connector app_to_db {
from: app_servers
to: db_primary
type: "orthogonal"
label: "Read/Write"
}
cloud aws_vpc {
name: "Amazon VPC"
}
rect api_gateway {
name: "API Gateway"
}
database postgres {
name: "User DB"
}
rect start_node {
name: "User Input Command"
}
diamond check_valid {
name: "Is DSL Valid?"
}
rect compile_ok {
name: "Draw Canvas"
}
circle center_node {
name: "App Idea"
}
circle node_a {
name: "Tech Stack"
}
circle node_b {
name: "Marketing"
}
rect CEO {
name: "Sarah (CEO)"
}
rect VP_Eng {
name: "David (VP Eng)"
}
rect VP_Prod {
name: "Tina (VP Product)"
}
rect users {
name: "users"
fields: "id PK, name, email"
}
rect drawings {
name: "drawings"
fields: "id PK, user_id FK, title"
}
aws_vpc main_vpc {
name: "AWS VPC (10.0.0.0/16)"
}
aws_route53 dns {
name: "Route 53 DNS"
}
aws_alb lb {
name: "Application LB"
}
aws_ec2 web_app {
name: "EC2 Web Instance"
}
aws_rds postgres {
name: "RDS Database"
}
aws_s3 storage {
name: "S3 Asset Bucket"
}
connector { from: dns to: lb }
connector { from: lb to: web_app }
connector { from: web_app to: postgres }
connector { from: web_app to: storage }
pipeline production_pipeline {
stages: "Source, Build, Test, Deploy"
}
stage source {
name: "Git Source"
status: "success"
}
stage build {
name: "Webpack Builder"
status: "success"
}
stage test {
name: "Jest Test Runner"
status: "success"
}
stage release {
name: "Cloudflare Deployment"
status: "in-progress"
}
connector { from: source to: build }
connector { from: build to: test }
connector { from: test to: release }
Designed for Visual Thinkers
A set of clean features built specifically to improve drawing speed, consistency, and shareability.
Unlimited Drawings & Pages
Create endless separate files or multi-page documents. Delimit sheets with a simple triple dash delimiter (---) to toggle easily inside the editor.
Responsive & Touch Ready
Access your diagrams anywhere. Full support for mouse-based computers, tablets, and smartphone touchscreen navigation with dedicated touch-selection close toggles.
Unlimited Asset & Icon Library
Quickly search and insert preloaded AWS architectures, cloud icons, or interface shapes. Drag-and-drop custom image assets directly onto your infinite work grid.
Download Clean Diagram Images
Export diagrams instantly to high-resolution PNG images. Built-in CORS protections safeguard external assets, keeping export results sharp, clean, and free of security locks.
Keyboard-Driven Duplication
Increase design efficiency. Use Cmd/Ctrl + Arrow keys to duplicate any node instantly in one of the 4 directions, maintaining perfect line connectivity and spacing automatically.
Pencil & Vector Routing
Sketch ideas naturally with the pencil tool. Connect elements with smart orthogonal lines that bend, wrap, and route around other blocks, keeping layouts readable.
AI-Enabled Diagramming
Describe what you want to build in plain English, and watch our compilation engine render a structured, editable diagram instantly. Modify the result visually, or edit the generated code in a snap.
Flexible Pricing Plans
Use DPad for free or unlock the full suite of diagramming capabilities.
Free Plan
Perfect for visual outlines and basic diagramming.
- Up to 3 active drawing slots
- Infinite canvas scroll & zoom
- Auto-connection mechanics
- Standard PNG image exports
Pro Monthly
Unlock unlimited diagrams, uploads, and AI compilation.
- Unlimited drawings and pages
- Online web icon integrations (Iconify API)
- Drag-and-drop custom image uploads
- AI Prompt-to-Diagram Generation (Beta)
Pro Annual
Save over 30% with yearly billing. Fully featured.
- All Pro Features included
- Priority support & updates
- Cancel subscription anytime
Frequently Asked Questions
Got questions about DPad? Find some quick answers here.
What is DPad?
DPad (The Drawing Pad) is an elegant diagram editor that allows you to design structures either by typing a clean, simple layout description language (DSL) on the left panel, or by dragging and dropping elements directly on the infinite canvas. Visual actions automatically update the code, and typing updates the visuals, giving you the best of both worlds.
Does DPad support offline work?
Yes. DPad saves your current drawing state into local browser slots automatically. It operates seamlessly inside modern web viewports, allowing you to edit and retrieve local layouts without server connection requirements.
What formats can I export my designs to?
You can export diagrams as high-resolution PNG image files. The exporter is built with specific CORS filters for preloaded and web-based icons (Iconify API), preventing canvas security locks and keeping output drawings clean.
How does the auto-duplication navigation work?
When selecting a node on the editor canvas, you can press Cmd/Ctrl and any arrow key (Up, Down, Left, Right). DPad will automatically duplicate the shape in that direction, preserve spacing, and build a connected connector line instantly. This allows you to construct complex infrastructure nodes in a matter of seconds.