Free

Free coded apps to suit all. No sign up, no email, usable offline, updates when I can, feedback welcome. Send feedback

How-to

Shape tools and custom shapes in Paint by Zaweba

Rectangles with separate corner radii, gears, banners, arrowed lines, smart shapes like clouds and callouts, and custom shapes in Paint by Zaweba.

Shape tools and custom shapes in Paint by Zaweba

Buttons, banners, badges, arrows, speech bubbles and icons are the building blocks of everyday design, and drawing them by hand is slow and rarely neat. The shape tools in Paint by Zaweba draw them as clean vectors that stay sharp at any size and stay editable afterwards.

The Shape tool

The Shape tool draws a range of geometric shapes: rectangle, ellipse, triangle, line, banner, gear, cross, ring and more. While you drag, the width and height are shown live, so you can draw a button exactly the size you need without measuring afterwards.

Rectangles have separate corner radii. You can round only the top corners for a tab, round one corner for a modern card or give each corner its own radius. That is far more flexible than a single rounded-rectangle setting.

The Line tool

The Line tool draws straight lines with a weight you set and arrowheads at either end, or both. Use it for annotations on screenshots, diagrams, callouts pointing to parts of a product, or simple dividers in a layout. Because the line is a vector, you can change its weight or its arrowheads later.

Smart shapes

Beyond the basics, there are smart shapes: cloud, crescent, teardrop, pie, trapezoid, double star, callouts, puzzle piece, and a cog with holes. These are shapes that are fiddly to build from simple pieces, and they turn up all the time in design work.

Callouts make speech bubbles and labels for comics, social posts and instructions. Clouds and teardrops suit children's designs and playful graphics. Pie shapes make simple charts and progress rings. Puzzle pieces and cogs work for business graphics about teamwork or how a process fits together.

Custom shapes

The Custom Shape tool draws shapes from a library. Six are built in, and you can add your own with Save as Custom Shape, from a path. Draw a logo or an icon once with the Pen, save it as a custom shape, and from then on you can draw it at any size in a single drag. For a business, a small library of brand marks and icons saves a lot of time.

Every shape is a vector shape layer, so its fill, stroke and corners can be changed after you draw it. The Properties panel handles fills, strokes and radii; the Direct Selection and Path Selection tools change the geometry. Scale a shape up to poster size and it stays perfectly crisp, which pixel drawing can't do.

Tips for neat design

Draw with the live size in view and get dimensions right as you go. Use the align and distribute options of the Path Selection tool to line up several shapes. Keep a consistent corner radius across a design for a tidy, professional look.

Use shapes as masks. A shape layer clipped to a photo makes a picture in the shape of a circle, a hexagon or any custom shape, a common style for profile pictures and product tiles.

Combine shapes. Overlapping shapes on the same layer can be added, subtracted or intersected to make new shapes, such as a ring with a notch or a badge with a cut-out.

Where they fit in

Shape tools work alongside the text tools and Layer Art effects in Paint by Zaweba. A shape with a gradient fill, a soft shadow from Layer Art and a line of text on top is the recipe for most buttons, banners and social graphics. Because gradients are shared across the app, the same brand gradient can fill shapes, text and backgrounds alike.

A few minutes spent exploring the shape list pays off quickly. Many design jobs that seem to need a separate vector program can be done right here.