TikZ Editor
The TikZ Editor is a visual canvas for creating diagrams that generates TikZ (LaTeX) code in real time. Use it as a standalone tool at app.texpile.com/tools/tikz-editor or embed diagrams directly into your Texpile documents.
Using in Texpile Documents
To add a TikZ diagram inside a Texpile document, click Insert > Draw. The diagram is editable inline - click on it to open the visual canvas, and changes update the TikZ output automatically.
Drawing Tools
The toolbar provides 8 tools, each with a keyboard shortcut:
| Tool | Shortcut | Description |
|---|---|---|
| Select | V | Select, move, and resize shapes. Hold Ctrl to multi-select. |
| Rectangle | R | Draw rectangles with variable width and height. |
| Ellipse | C | Draw ellipses with configurable radii. |
| Line | L | Draw straight lines and arrows. |
| Curve | U | Draw Bezier curves with draggable control points. |
| Arc | A | Draw circular arcs with adjustable start and end angles. |
| Pen | P | Freehand drawing with automatic point simplification. |
| Text | T | Place text labels on the canvas. |
Shape Properties
Select any shape to edit its properties in the side panel:
- Position & Rotation - Set exact x, y coordinates and rotation angle.
- Color & Fill - Choose stroke color, fill color, and opacity.
- Line Style - Adjust line width, dash patterns, and arrow types.
- Rounded Corners - Add border radius to rectangles.
Layers
The Layer Manager panel lets you organize your diagram:
- Reorder - Move shapes forward or backward in the draw order.
- Rename - Give layers descriptive names for easier management.
- Show/Hide - Toggle visibility of individual shapes.
- Lock - Lock shapes to prevent accidental edits.
TikZ Code
The code panel on the right shows the generated TikZ code in real time as you draw. You can:
- Copy the TikZ code and paste it into any LaTeX document.
- Canvas coordinates are automatically converted to LaTeX units (cm).
- The bounding box defaults to 15cm x 10cm and is configurable.
Grid & Snapping
Enable the grid overlay for precise placement. Shapes snap to grid points when the grid is active, making it easy to align elements.
Undo & Redo
Use Ctrl + Z to undo and Ctrl + Y to redo. The editor maintains a full history stack of your changes.