How to Make a Logo in Adobe Illustrator — Step by Step
Adobe Illustrator is the professional standard of logo design: virtually every mark in our catalog passed through it or its peers. To a beginner the program looks terrifying — hundreds of tools, of which a logo needs maybe ten. Here's the whole route: from a new document to a file kit both the print shop and the developer will accept.
The route: an RGB document for screen (the CMYK version comes later) → the mark is assembled from shapes and Pathfinder, not drawn with the pen → grids and guides for alignment → type → Create Outlines before export → Export for SVG/PNG, Save As for PDF. No Illustrator? The same process works in the free Inkscape and in Figma.
How Illustrator differs from Figma for this job
Both are vector editors, and a simple mark can be built in either — see our Figma guide. Illustrator wins where precision and print matter: full CMYK and Pantone (and here's why that matters), fine‑grained Pathfinder booleans, tools for complex curves (Width Tool, per‑corner rounding), EPS export for conservative vendors who need the right format for the right job. The price — the subscription and the learning curve.
Step 1The document
Create a 1000×1000 px RGB document — screen mode is more convenient for design; the print CMYK version is a conversion at the end. Add two more artboards right away: 48×48 and 16×16 — controls for testing the mark at icon and favicon size. Turn on Smart Guides (⌘U) — without them alignment is torture.
Step 2The mark: shapes + Pathfinder
The universal rule applies: clean logos are assembled from simple shapes, not drawn freehand. The tools:
- Shapes: Ellipse (
L), Rectangle (M), Polygon. Hold Shift for true proportions. - Pathfinder (Window → Pathfinder) — the heart of the process: Unite merges shapes, Minus Front subtracts the top one, Intersect keeps the overlap. A crescent = circle minus circle; a leaf = the intersection of two circles.
- Rounding: drag the Live Corners widgets — each corner's radius adjusts separately, which many editors can't do.
- The Pen (
P) — only for forms shapes can't produce. Rule: minimum anchor points; every extra point is potential wobble. - Guides from shapes: build a grid of circles (as in the ChatGPT mark or the Apple apple), select and convert to guides (
⌘5) — arcs are trued against them.
Illustrator is mathematically perfect — but the eye isn't: a circle next to a same‑height square looks smaller; a horizontal line of equal weight looks thicker than a vertical one. Professionals correct these by eye on top of the geometry — this is what separates a living mark from a machined one — a good case study is the arcs in the Spotify logo.
Step 3The wordmark
Set the name with the Type tool (T). Choosing the face is its own discipline with legal traps: the font must be licensed for commercial use — the full font guide covers this in depth. Adjust tracking and kerning by hand (Alt+arrows between letters): the default fit almost always needs fixes in a couple of spots.
Before export — Type → Create Outlines (⇧⌘O): the text becomes curves and stops depending on installed fonts. Keep a copy with live text — there's no way back from curves.
Step 4Color and versions
Assign colors and save them as global Swatches (the Global checkbox) — changing a shade then updates every object at once. Build the palette by the method in how to build a brand color palette. Produce the mandatory kit immediately — here's why it looks the way it does: color version, black, white (check it on a dark artboard), the compact mark without text.
Step 5Checks
- Copy the mark to the 48 and 16 px control artboards: the silhouette must survive.
- View → Pixel Preview: this is how screens will see the mark — hairlines that mush into pixels show instantly.
- Convert a copy to grayscale (Edit → Edit Colors → Convert to Grayscale): the composition must work without color.
- Object → Path → Clean Up: removes stray points and junk objects that would later bloat the SVG.
Step 6Export: three doors
| Destination | How | Settings |
|---|---|---|
| Web, developers | File → Export → Export As → SVG | Styling: Presentation Attributes; Decimal: 3; text already outlined |
| Print shop | File → Save As → PDF | convert colors to CMYK (details) |
| Social, documents | Export As → PNG | 1x/2x/4x, Transparent checked (why transparency) |
Run the exported SVG through an optimizer — Illustrator writes redundant metadata, and we cover how to clean an SVG like that. Archive the working AI file with live text — that's your master source, and it's worth knowing what should be in the kit a designer hands over.
Common Illustrator beginner mistakes
- Strokes not outlined. Object → Path → Outline Stroke before finalizing: strokes scale differently than fills.
- Eyeballing without a grid. Half‑pixel misalignments are invisible in a mockup and glaring on signage.
- Transparency and effects in SVG. Shadows, raster effects and blend modes break SVG — the mark must be pure fills.
- One artboard for all versions. Each version gets its own artboard: batch export, nothing gets lost.
- A CMYK document for a screen mark. Colors go dull at the design stage. The order is the reverse: RGB for design, CMYK by conversion for print.
Next: run the mark through the mistake checklist, assemble the palette and a mini guideline — we explain what a brand book actually is separately. Free alternatives to everything above — Inkscape and Figma; the generative route — an AI logo polished in the same Illustrator.