Woof Mate

Design System

Design System

Design System

COLORI

Color Tokens

Semantic

Primary

#FFFFF7

White

#FFFFFF

TextStrong

#0D0D0D

Text

#3B3B3B

Brand & Accent

Main

#B4C0F5

Yellow

#FFC357

Pink

#E31787

Light Pink

#FFEEF5

Light Blue

#E7EBFC

Light Blue 01

#D0D7F9

Neutral Scale — N1 → N11

N1

N2

N3

N4

N5

N6

N7

N8

N9

N10

N11

TIPOGRAFIA

Type Scale

The dog sitter

The dog sitter

Poltawski Nowy

64px · 4rem · 48pt · 500 · h1

Care and quality

Care and quality

Poltawski Nowy

40px · 2.5rem · 30pt · 600 · h2

Dog sitting & photography

Dog sitting & photography

Poltawski Nowy

28px · 1.75rem · 21pt · 500 · h3

Your pet deserves the best

Your pet deserves the best

Poltawski Nowy

20px · 1.25rem · 15pt · 500 · h4

We keep your dog active and happy

We keep your dog active and happy

Istok Web

24px · 1.5rem · 18pt · 400

Your pet is safe with me — always.

Your pet is safe with me — always.

Istok Web

18px · 1.125rem · 13.5pt · 400

Book a session and we’ll take care of the rest.

Book a session and we’ll take care of the rest.

Istok Web

16px · 1rem · 12pt · 400

From €35/day — updates and photos included.

From €35/day — updates and photos included.

Istok Web

14px · 0.875rem · 10.5pt · 400

Caption text · photo credits · metadata · timestamps

Caption text · photo credits · metadata · timestamps

Istok Web

12px · 0.75rem · 9pt · 400

Servizi · Woof Mate · Fotografia

Servizi · Woof Mate · Fotografia

DynaPuff

13px · 0.8125rem · 9.75pt · 500 · Label

FONDAMENTA

Spacing & Radius

Spacing Scale

8

16

24

32

48

64

80

120

Border Radius

8px

16px — Icon

24px

32px — Card

100px — Pill

Font Pairings

Poltawski Nowy

Display — Hero headings

Poltawski Nowy

H2, H3, H4 — Section titles

Istok Web

Body — Paragraphs & UI text

DynaPuff

Brand — Labels & Nav accent