Keyshape Features
Drawing Tools
- Use typical vector tools, such as the Node, Pen, Pencil, Rectangle, Ellipse, Hand and Zoom tool
- Immediately see a preview of the shape as you draw
Path Operations
- Adjust individual nodes and their control points
- Convert text and rectangles into paths
- Convert the outline of a stroke into a path
- Combine and break apart paths
- Unite, subtract, intersect and exclude two or more paths together
Text Features
- Supports text-on-path for curved text
- Supports right-to-left text and bidirectional text
- Create vertical text for East Asian scripts
- Keep texts editable in your designs and automatically convert them to paths at export time
Painting with Stroke and Fill
- Use linear and radial gradients
- Supports dashed strokes
- Supported blending modes: Normal, Darken, Multiply, Color Burn, Lighten, Screen, Color Dodge, Overlay, Soft Light, Hard Light, Difference, Exclusion, Hue, Saturation, Color, Luminosity
- Supported CSS shorthand filters: Blur, Drop Shadow, Brightness, Contrast, Grayscale, Saturate, Hue Rotate, Invert, Sepia, Opacity
Layers and Groups
- Organize your artwork into layers and groups
- Rearrange objects by dragging and dropping them in the Object Tree
Grids and Pixel Snapping
- Use multiple grids in one document
- Use pixel snapping to get pixel-aligned vector graphics
- Snap to objects, node points and grids
Symbols
- Use symbols to reuse the same objects multiple times
- Supports nested symbols
Bitmap Images
- Supports PNG and JPEG images
- Use embedded or linked images
- Can automatically embed all images during SVG export
Hyperlinks
- Create and edit hyperlinks
Preview Animations
- Play animations back on the same canvas where you draw them
- Up to 60 fps playback
- Preview animations on web browsers with a click of a button
Timeline
- Timeline-based animations with keyframes
- Linear, spline and stepped easing timing functions
- Repeated animations
- Auto-keyframing
Animatable Properties
- Use motion paths to move objects along paths
- Create line animations with animated dash arrays
- Supports path shape morphing
- Animate position, rotation, skew, scale, opacity, stroke opacity, fill opacity, stroke color, fill color, stroke width, dash array, dash offset, path shape, and filter properties
Standards Based File Format
- Internal file format based on SVG 2
- Supports an uncompressed plain text format to store files in version control systems, such as Git
Work with SVG
- Open SVG documents created in other vector graphics software, such as Sketch, Adobe Illustrator or Affinity Designer
- Copy SVG code from Keyshape to a text editor
- Copy-paste SVG code from a text editor or web page to Keyshape
Export Formats
- SVG with JavaScript Animations
- SVG with CSS Animations
- SVG Image Sequences
- SVG Sprite Sheets
- Animated Vector Drawables for native Android apps*
- Lottie / Bodymovin animations for native Android, iOS, macOS and React Native apps*
- Animated GIF
- PNG Image Sequences and Sprite Sheets
- JPEG Image Sequences and Sprite Sheets
- MPEG-4 video
* available as a plugin
Plugins
- Plugins can be created by third-party developers to add new features to Keyshape
- Import plugins to open new file formats
- Export plugins to write new file formats
Supported SVG Features
- Shapes: rect, ellipse, path, text, image
- Transformations: translate, scale, rotate, skew
- Stroke and fill color and opacity
- Linear and radial gradients
- Stroke cap and join styles with mitering
- Stroke dashes
- Vertical text
- Blending modes
- CSS shorthand filters
- Symbols
- Masking and clipping
- Linking
System Requirements
- macOS X 10.11 El Capitan or later
- Hardware accelerated OpenGL