Design system · spot illustrations

Goldito illustrations

43 pieces in four groups, each concept with a variant or two, all drawn by one generator so they follow the same rules. v2 fixes the walk (no more tree with a swirl) and the search handle.

Library 43 pieces · 19 are variants

Pets 10

Coats follow the Tamagotchi presets (white, golden, orange, tuxedo) plus brown, black, grey and calico, and two dog ear shapes. The app picks the closest one from breed and coat.

Dog · fluffy whitePet without a photo (default dog)
Dog · goldenGolden coatsvariant
Dog · brownBrown and chocolate coatsvariant
Dog · blackBlack coatsvariant
Dog · pointy earsShiba, corgi, husky typesvariant
Dog · pointy, greyHusky, grey coatsvariant
Cat · orangePet without a photo (default cat)
Cat · tuxedoBlack and white coatsvariant
Cat · greyGrey and blue coatsvariant
Cat · calicoCalico and tortie coatsvariant

Care 13

What the sitter does in a day.

Food bowlMeals, treat check
Water bowlWater, hydrationvariant
TreatTreats, snacksvariant
PillMedication
Medicine bottleMedication schedulevariant
Walk · paw trailWalks
Walk · leashWalks, going outvariant
Walk · parkPark, outdoorsvariant
Nap · moonNaps, night
Nap · bedRest, sleep spotvariant
PottyPotty breaks
BallPlay
BrushGrooming

Stay 8

The booking and the trip.

HomeStays, home safe
Home · safeHome safe, back homevariant
CarTrip, pick-up, drop-off
Map pinLocation, address
CalendarBookings, dates
KeyEntry info
Payment cardCheckout, paid
StarReview, rating

App 12

Everyday app moments.

CameraFeed, photos
PhotoAlbum, a single photovariant
HeartMood, diary, favorites
DiaryDiary, daily notevariant
PawStickers, generic pet
SearchNo search results
ChatChats
Chat · twoConversation, repliesvariant
BellNotifications
MailMessages, noticesvariant
ClockHistory, times
ShieldSafe, checked

Rules

One canvas120 × 120 viewBox. Artwork stays inside 8 to 112, so every piece reads the same size.
One outline3 px ink (#1B4332), round caps and joins, on every shape that has an edge.
Flat fills, nine coloursOnly the brand palette below. No gradients, no textures.
One ground shadowAn ink ellipse at 12% under each object (y 104). Nothing else casts shadow.
One small highlightA white sliver at 55 to 70% on round objects. Optional.
Front-facing, simpleOne object, centred, no perspective, no scene. A face only on pets.
  1. Safe area: the dashed box (8 to 112).
  2. Outline: the same 3 px ink line on the bowl, rim and kibble.
  3. Fills: terracotta, cream, bark.
  4. Ground shadow: the soft ellipse at the bottom.
  5. Detail: the paw on the bowl, in cream, no outline.

Palette

Nine brand colours, plus three fur tones used only on pet coats (charcoal #3B4541, slate #A9B0A8, white).

Ink#1B4332 · outline, dark parts
Cream#FFF9F0 · light fills
Mint#D8F3DC · soft fills
Leaf#52B788 · plants, dots
Green#2D6A4F · solid shapes
Sand#F4A261 · fur, camera
Saffron#E9C46A · gold, ball, moon
Terracotta#E76F51 · bowl, heart, roof
Bark#B5652E · kibble, trunk

Where it comes from

SourceThe prototype's set (redesign/art.svg, Oct 6), drawn as placeholders for the Expressive look. The Figma Expressive screens use the same pieces (Snap, Diary timeline, Home stats, pet tiles).
Style familyOutlined flat stickers: thick even outline, flat brand fills, one contact shadow. The family friendly consumer apps use for spot art; it fits the gold coin logo and the pixel pets because all three are bold, flat and simple.
PaletteDESIGN.md brand colours (ink, mint, leaf, green) plus the warm accents from the Expressive colour blocks.
Honest statusPlaceholder quality, but consistent. Final art could replace any piece later if it keeps the id and the rules.

Is it sustainable?

Use the illustrationsDon't use them
Adding a pieceAbout 15 minutes per piece with the rules above (v2 added 31 in one pass). Drawn by one generator (illustrations/build.py), exported to Art.tsx, plus the plugin for Figma.Nothing to add.
How many we need43 now (with variants); every emoji in the app has a match.0
Consistency riskLow while the rules are followed; drifts if pieces get drawn freehand.None, but the screens lean on photos and type alone.
Older usersPictures help people find the right tool at a glance (bowl = treat, heart = mood).Fine if labels are clear; less to recognise, more to read.
BrandWarm, matches Figma and the coin logo.Calmer, closer to a utility app.

My pick: use them

With or without

Snap

Treat checkCan my pet eat this? Snap the label.›
MoodHow does my pet seem? For fun only.›
StickerCut my pet out and decorate the diary.›

Diary

No diary yetWhen a stay is on, updates show up here live.Open History

Home

Your pets
MaxMaltese · 4 yrs
MMochiShorthair · 3 yrs · no photo yet
Bookings
No sitters matchTry more km or other dates.

Pet name chips

On Snap and the treat check. Today: 🐶 Max.

Today · emojiLooks different per phone.
🐶 Max🐱 Mochi
A · Photo, else illustrationChosenRecognisable at a glance; same rule as pet cards.
MaxMochi
B · Illustration onlyEven look, but every dog looks the same.
MaxMochi
C · Name onlySimplest; relies on the name.
MaxMochi