Design Studio — ID Cards, Certificates, Posters, Thumbnails

Design Studio is a small vector design editor for the things people make most often: an ID card, a certificate, a poster, a video thumbnail, a social media post or a banner. Choose a size, then draw rectangles, ellipses, lines, polygons and stars, write text, place your own pictures and logos, and draw freehand with the pencil or in straight lines with the pen. Every object sits on its own layer: move, resize and turn it with the handles, line it up with others, group it, lock it so it stays put, or hide it. Fills can be a colour or a gradient, outlines any colour and width, and anything can be made see-through. When it is ready, save it as an SVG that stays sharp at any size, a PNG or JPEG picture, or a PDF — print sizes such as the ID card and the A4 certificate are made at 300 dpi, so the PDF prints at its true size.

1. Start with File › New design… and pick a size: an ID card, a certificate, a poster, a thumbnail, a square post, a story or a banner.
2. Pick a tool on the left and drag on the canvas to draw it, or click for one of the usual size. Hold Shift for a square or a circle.
3. Select an object to change it on the right: its position and size, angle, fill, outline, opacity and, for text, the words, typeface, size and alignment.
4. Use the layers list to choose, hide or lock objects; Arrange lines objects up, spaces them evenly and moves them in front of or behind others.
5. Place a photo or a logo with the picture button; SVG logos are cleaned of anything that could run before they are placed.
6. Download as SVG, PNG, JPEG or PDF from the File menu, and save the design to keep working on it later.

• Text uses typefaces every computer has (a sans serif, a serif, a monospace and a handwriting face), or a font file of your own (.ttf, .otf, .woff or .woff2, up to 10 MB), which stays in this tab only and is never uploaded. A saved design file names your font but does not carry it: add the font again after opening the design.
• The SVG keeps text as text; a font of your own is put inside it, so it shows wherever the SVG is opened. Check that the font’s licence lets you embed it. The PNG, JPEG and PDF draw the text as it looks on your screen.
• The pen places points joined by straight lines; Smooth every point (or one point, in Edit points) turns them into curves, and a point’s two handles bend the curve — Alt bends it sharply. The pencil draws freehand lines.
• A design is one page. For many pages, save each one, or use the PDF tools to join the PDFs.
• Everything happens in this browser tab. Pictures you place are read from your device and kept inside the design; nothing is uploaded to ToolsDev or anyone else, and nothing is stored after you close the tab unless you save the design file yourself.

Yes, if you print the PDF at 100% ("actual size", not "fit to page"). The ID card canvas is 85.6 × 54 mm — the size of a bank card, ISO/IEC 7810 ID-1 — made at 300 dpi, and the PDF page is exactly that size.

Yes. File › Save the design downloads a .json file with everything in it, pictures included; File › Open a design opens it again, here or on another device.

Place a PNG or an SVG with the picture button. Its transparent parts stay transparent, and you can turn the canvas background off for a PNG with no background at all.

Yes — Ctrl+Z (⌘Z on a Mac) undoes each step, and Ctrl+Shift+Z redoes it. A whole drag is one step.

Yes. Draw with your finger, pinch to zoom and use two fingers to move the canvas. The properties sit below the canvas on a narrow screen.