Create regular polygons (triangles, hexagons, octagons) and stars with customizable points. Edit individual vertices to create unique custom shapes.
Creating Polygons
Activate the Polygon tool
Press N or select the polygon icon from the shape tools.
Click and drag
Click on the canvas and drag to create a polygon. By default, it creates a hexagon (6 sides).
Release to finish
Release the mouse button to complete the shape.
Drawing Modifiers
| Modifier | Effect |
|---|---|
Shift |
Constrain to perfect polygon (equal width/height) |
Alt/Option |
Draw from center instead of corner |
Shift + Alt |
Draw perfect polygon from center |
Change the number of sides in the Properties Panel after creation. Polygons support 3 to 60 sides.
Creating Stars
Activate the Star tool
Press S or select the star icon from the shape tools.
Click and drag
Click on the canvas and drag to create a star. By default, it creates a 5-point star.
Release to finish
Release the mouse button to complete the shape.
Adjust the star's inner radius (0.0 to 1.0) in the Properties Panel to create different star styles, from sharp points to rounded shapes.
Vertex Edit Mode (v1.3.0)
Edit individual vertices to create custom polygon shapes beyond regular polygons. This powerful feature lets you reshape any polygon, star, or rectangle by moving, adding, or deleting vertices.
Enter Edit Mode
Double-click on any polygon, star, or rectangle to enter vertex edit mode. Blue circles appear on each vertex.
Select Vertices
Single-click on a vertex to select it (turns orange). Hold Shift and click to multi-select vertices.
Move Vertices
Drag selected vertices to reshape the polygon in real-time. The shape morphs as you drag.
Exit Edit Mode
Press Escape or click empty space to exit edit mode and save your changes.
Vertex Edit Operations
| Action | How To |
|---|---|
| Select vertex | Single-click on vertex (turns orange) |
| Multi-select | Shift + click on additional vertices |
| Lasso select | Click and drag to draw selection area |
| Move vertex | Drag selected vertex |
| Add vertex | Click on edge (blue line between vertices) |
| Delete vertex | Select vertex, press Delete or Backspace |
| Deselect all | Click on empty canvas |
| Exit edit mode | Press Escape |
Custom vertex positions are saved with the file and persist when you move or resize the shape. Changes can be undone with Cmd+Z.
Real-Time Reshaping
When dragging vertices in edit mode, the polygon shape updates immediately:
- Fill color updates in real-time
- Edges follow vertex positions
- Smooth 60fps animation
- No lag or delay
Vertex Constraints
Some limits ensure valid polygon shapes:
- Minimum 3 vertices: Cannot delete below triangle shape
- Maximum 60 vertices: Performance optimized for typical use
- Hit test radius: 8px click area around each vertex
- Edge click radius: 6px distance from edge to add vertex
Deleting vertices below 3 is prevented automatically. You'll need at least a triangle for a valid polygon.
Common Use Cases
Triangles & Arrows
Set sides to 3 for triangles. Edit vertices to create arrow shapes, pointing indicators, or directional markers.
Hexagons for UI
6-sided polygons work well for tiles, badges, profile frames, and geometric patterns.
Custom Badges
Create stars with 8-12 points, then adjust inner radius for badge-style shapes perfect for awards and achievements.
Organic Shapes
Start with a polygon, enter edit mode, and move vertices to create custom organic shapes, blobs, or decorative elements.
Properties Panel
When a polygon or star is selected, the Properties Panel shows:
- Point Count: 3-60 sides (polygons) or points (stars)
- Star Inner Radius: 0.0-1.0 (stars only)
- Width & Height: Dimensions in pixels
- Corner Radius: Round corners (all or individual)
- Fill & Stroke: Colors and styling
Point Count Handle
Polygons and stars feature an interactive handle for quick point count adjustment:
Using the Point Count Handle
- Location: Purple handle above the top vertex
- Visual: White circle with purple border and dot (distinguishes from rotation handle)
- Drag Up: Increase number of points/sides
- Drag Down: Decrease number of points/sides
- Live Preview: Tooltip shows current count during drag
- Range: 3-12 points/sides (min: triangle, max: 12-sided polygon)
Changing the point count via the handle automatically clears any custom vertices and regenerates a perfect parametric shape. This is undoable with Cmd+Z.
Star Inner Radius Handle
Stars feature an interactive handle at the center for adjusting the inner radius:
Using the Star Inner Radius Handle
- Location: Amber/orange handle at the center of the star
- Visual: White circle with orange border and dot (distinguishes from other handles)
- Drag Outward: Increase inner radius (points become less sharp)
- Drag Inward: Decrease inner radius (points become sharper)
- Live Preview: Tooltip shows current ratio percentage during drag
- Range: 0% to 95% (0% = very sharp points, 95% = almost circular)
Lower inner radius values (0-30%) create sharp, dramatic stars perfect for badges and awards. Higher values (60-90%) create softer, gear-like shapes. The handle provides instant visual feedback for finding the perfect ratio.
Keyboard Shortcuts
| Action | Shortcut |
|---|---|
| Polygon tool | N |
| Star tool | S |
| Enter edit mode | Double-click on shape |
| Exit edit mode | Escape |
| Delete vertex | Delete or Backspace |
| Multi-select vertices | Shift + click |
| Perfect shape (creation) | Shift + drag |
| Draw from center | Alt + drag |
Tips & Best Practices
Performance
For best performance, keep polygon vertex counts reasonable (under 30 vertices). The app is optimized for typical use cases.
Precision
Use the grid and snap features when editing vertices for precise alignment. Hold Shift to constrain movement.
Combining Shapes
Use boolean operations to combine multiple polygons into complex shapes. This is more efficient than creating very high vertex counts.
File Size
Custom vertex positions are stored efficiently. Edited polygons add minimal file size overhead.
Troubleshooting
Can't select vertices
Make sure you've entered edit mode by double-clicking the polygon. Single-click outside edit mode selects the entire shape.
Vertices jump when dragging
Grid snap may be enabled. Toggle grid snap in the menu or use Cmd+Shift+G.
Can't delete vertex
Polygons need at least 3 vertices. If you have exactly 3 vertices (triangle), deletion is prevented.
Shape disappears after editing
Check that vertices haven't been moved to create a zero-area polygon. Use Cmd+Z to undo.