Illustrations

The illustration library has 235 original scenes in 30 packs. Each pack is one consistent look across all its scenes (onboarding, empty states, errors, success screens, marketing), so a whole product can share it.

Free and Pro#

Illustrations are a Pro library. Everyone can browse every pack, preview every scene and try the accent colour. Downloading scenes, recolouring them, copying SVG and the pack ZIPs need Pro.

Recolour to your brand#

Every pack has an accent colour. Pick yours on the pack page and every scene follows it at once, in the preview and in the files you download. The rest of the palette is tuned to work with any accent, so you can match a brand colour without redrawing anything.

Formats#

Scenes fill their frame edge to edge in a 4:3 shape, so they line up in a grid and crop cleanly.

Animated packs#

Packs marked Animated move. Each scene downloads as:

• Animated SVG: CSS animation inside the file, for websites. It plays wherever the SVG is shown inline or as an image, and rests on its first pose for visitors who prefer reduced motion.
• Lottie (JSON): for apps and sites that use a Lottie player.
• MP4 and GIF: for video, slides, email and social posts.

On a website#

Host the SVG with your site and show it as an image. Give it real alternative text when it carries meaning, and an empty alt="" when it is decoration:

<img src="/images/onboarding-welcome.svg" width="720" height="540"
     alt="A person waving from a laptop screen" loading="lazy">

/* Scenes are 4:3; keep them responsive */
.hero-illustration { width: 100%; height: auto; max-width: 720px; }

In design tools#

• Figma and Illustrator: drag in the SVG. Every shape stays editable, so you can hide a prop or change a single colour.
• Slides and documents: use the PNG, or the SVG where the app accepts it.

Licence in short#

Scenes downloaded while Pro is active may be customised and used in personal, commercial and client projects, including websites, apps, presentations, themes and templates. Credit is welcome, never required. Work made while your plan was active stays licensed after it ends. You may not resell the scenes as standalone assets or as a collection, or build a competing library. See the licences page.