Paint SPaint S
Introduction
User Manual
Topics
FAQ
Privacy Policy
App Store
Introduction
User Manual
Topics
FAQ
Privacy Policy
App Store
  • Topics about this app

    • Choose a Color
    • Choose a Gradient
    • Pattern
    • Remove Image Background
    • Curved Text
    • Content Library
    • Font Library
    • Transform Objects
    • Polyline Tool
    • Vector Pen Tool

Vector Pen Tool

The Vector Pen tool gives you professional-level control over path creation. Use it to draw precise custom shapes, smooth curves, and complex vector paths with full editing capabilities.

Understanding Anchor Points and Handles

The Vector Pen tool works with two types of points:

  • Straight points: Simple anchor points that create straight line segments
  • Curved points: Anchor points with direction handles that control curve shape and smoothness

When you drag while placing a point, you create curved points with handles that determine the curve's direction and intensity.

Basic Drawing Techniques

Creating Straight Lines

  1. Select the Vector Pen tool from the toolbar or choose Tool > Vector Pen
  2. Click on the canvas to place the first anchor point
  3. Click again to place the next point — a straight line connects them
  4. Continue clicking to add more points
  5. To finish:
    • Double-click anywhere
    • Right-click to finish and show the context menu
    • Click back on the starting point (a "Click here to end" tip appears when you are close to it)

Creating Curves

  1. Click and drag to place a curved point
  2. As you drag, two direction handles appear
  3. The handles control the curve's shape:
    • Drag further from the point for a stronger curve
    • Change the handle angle to adjust curve direction
  4. Release the mouse button to set the curve
  5. Click and drag the next point to continue the curved path

Tips

Adjacent curved segments share mirrored handles for smooth transitions. This creates natural-looking curves without sharp corners.

Alternative Curve Method

You can also hold Option (⌥) while clicking to place a curved point without dragging. This is useful for quick curve placement.

Angle Constraints

Hold Shift while placing points to constrain segments to:

  • Horizontal (0°)
  • Vertical (90°)
  • 45-degree angles (45°, 135°, etc.)

This helps maintain geometric precision in your paths.

Finishing and Editing Paths

While Drawing

  • Press Delete to remove the last segment and continue drawing
  • Press Esc to discard the last segment and finish the current path

After Completion

Click the finished path to select it: editing knobs appear on every point, and you can drag them right away.

Point Operations

  • Select a point: Click on an existing anchor point
  • Remove a point: Select it and press Delete
  • Add a new point: Double-click on a line segment where you want the new point
  • Toggle point type: Double-click an existing point to switch between straight and curved

Reshaping Curves

  • Drag the direction handles of a curved point to adjust the curve shape
  • Handles on adjacent segments mirror each other for smooth continuity

Converting to Shape

To fill a path or treat it as a closed shape:

  1. Select the path
  2. Right-click to open the context menu
  3. Choose Close Path

The path becomes a closed shape that can be filled with a color, a gradient, or a pattern.

Practical Workflows

Drawing a Custom Icon

  1. Plan your icon's key anchor points
  2. Place straight points for sharp corners
  3. Use curved points for rounded areas
  4. Close the path by clicking back on the start
  5. Apply fill and stroke colors, gradients, or patterns

Creating a Smooth Logo Curve

  1. Start with the first anchor point
  2. Click and drag to create the first curve
  3. Continue with additional curved points, adjusting handles as you go
  4. Finish when the curve is complete
  5. Select the path and drag individual handles to fine-tune it

Building a Complex Multi-Segment Path

  1. Alternate between straight clicks and click-drag operations
  2. Use Shift for constrained angles where needed
  3. Don't worry about perfection — you can edit everything later
  4. Finish the path and select it to refine point positions and handle angles

Advanced Techniques

Combining Straight and Curved Segments

Mix point types within a single path:

  • Click for straight segments
  • Click and drag for curved segments
  • The tool seamlessly transitions between types

Precise Handle Adjustment

When editing a curved path:

  • Small handle movements create subtle curve changes
  • Longer handles produce more dramatic curves
  • Handle angle determines curve direction
  • Handle length controls curve intensity

Creating Closed Shapes

To make a fillable shape:

  1. Draw your path with multiple points
  2. End by clicking back on the starting point
  3. Or use Close Path from the context menu
  4. Apply fill color in the Attributes panel

Common Use Cases

Technical Diagrams

Use straight points with Shift constraint for clean, precise technical drawings and flowcharts.

Organic Shapes

Use curved points with carefully adjusted handles for natural-looking organic forms like leaves, clouds, or waves.

Custom Borders and Frames

Create unique border shapes by drawing closed paths and applying stroke styles — a solid color, a gradient, or a tiled pattern.

Lettering and Typography

Draw custom letterforms or modify existing text by converting it to paths and editing anchor points.

Tips for Better Results

  • Plan ahead: Visualize your path structure before placing points
  • Fewer points = smoother curves: Use the minimum number of points needed
  • Edit iteratively: Don't aim for perfection while drawing — refine the path after selecting it
  • Use both methods: Combine click-only and click-drag techniques as needed
  • Practice handle control: Mastering direction handles is key to smooth curves
  • Zoom in for precision: Use zoom to place points accurately in detailed work

Comparison with Other Tools

FeatureVector PenPolylineCurve
Straight segments✓✓✗
Curved segments✓✓✓ (single)
Handle editing✓✓✓
Multiple curve segments in one path✓✓✗
Best forPrecise custom pathsQuick multi-segment shapesSimple two-point curves

Related Topics

  • Polyline Tool — For simpler multi-segment shapes
  • Transform Objects — For resizing and rotating completed paths
  • Choose a Color — For styling your vector paths
  • Pattern — For filling or stroking your paths with a tiled image
Prev
Polyline Tool