Brand

The wuapi logo, colors and type. Take one file below, or the whole kit with every size and variant.

Download the brand kitwuapi-brand-kit.zip · 181 files · SVG + PNG

01/Logo

A bubble with a face

Use the SVG when you can. Color is the default on dark backgrounds; on light ones, use color on light. The one-color versions are for print and photos.

On light

On dark

Mark

The bubble alone. For small spaces and anywhere the name is already written next to it.

Color Dark backgrounds. The default.

SVG PNG

PNG px16 32 48 64 96 128 180 192 256 384 512 1024 2048

Color on light Light backgrounds.

SVG PNG

PNG px16 32 48 64 96 128 180 192 256 384 512 1024 2048

White One color, for dark backgrounds and photos.

SVG PNG

PNG px16 32 48 64 96 128 180 192 256 384 512 1024 2048

Black One color, for light backgrounds and print.

SVG PNG

PNG px16 32 48 64 96 128 180 192 256 384 512 1024 2048

On light

On dark

Lockup

Mark and wordmark. The first choice wherever it fits. PNG sizes are heights.

Color Dark backgrounds. The default.

SVG PNG

PNG px32 64 128 256 512 1024 2048 3072

Color on light Light backgrounds.

SVG PNG

PNG px32 64 128 256 512 1024 2048 3072

White One color, for dark backgrounds and photos.

SVG PNG

PNG px32 64 128 256 512 1024 2048 3072

Black One color, for light backgrounds and print.

SVG PNG

PNG px32 64 128 256 512 1024 2048 3072

On light

On dark

App icon

The mark on a filled square, for avatars, app stores and sign-in screens. The mark stays inside the circle that round crops cut.

Color, square Lime mark on ink. The default avatar.

SVG PNG

PNG px16 32 48 64 96 128 180 192 256 384 512 1024 2048

White, square White mark on ink.

SVG PNG

PNG px16 32 48 64 96 128 180 192 256 384 512 1024 2048

Black, square Ink mark on paper.

SVG PNG

PNG px16 32 48 64 96 128 180 192 256 384 512 1024 2048

Color, rounded Lime mark on ink. The default avatar.

SVG PNG

PNG px16 32 48 64 96 128 180 192 256 384 512 1024 2048

White, rounded White mark on ink.

SVG PNG

PNG px16 32 48 64 96 128 180 192 256 384 512 1024 2048

Black, rounded Ink mark on paper.

SVG PNG

PNG px16 32 48 64 96 128 180 192 256 384 512 1024 2048

Favicon and social

Ready-made files for browsers, link previews and profiles.

favicon.ico16, 32 and 48 px

apple-touch-icon.png180 px

avatar-500.png500 px, for GitHub, npm and profiles

og-card.png1200 x 630 social card

02/Color

Lime is the signal

Lime marks something live or the one action on a screen. Everything else is ink, paper and stone. Click a value to copy it.

Lime#D4FF3F

--accent, dark

The bubble, the LED and the one call to action on dark.

Olive#4D7C0F

--accent, light

The accent on light, where lime can't be read.

Ink#0A0A0A

--background, dark

Dark background and the face on the lime bubble.

Paper#FAFAF9

--background, light

Light background and text on dark.

Stone#57534E

--muted-foreground, light

Secondary text on light.

Ash#A8A29E

--muted-foreground, dark

Secondary text on dark.

Rule#262626

--border, dark

Hairlines on dark.

Rule light#E7E5E4

--border, light

Hairlines on light.

03/Type

Inter and JetBrains Mono

Both are free under the SIL Open Font License.

Inter

Interface, body and headlines. The wordmark is Inter SemiBold at -0.035em, outlined.

rsms.me/inter

Link a number, send a message.

Your code talks REST, we handle the phone. Headlines are semibold with tight tracking, in sentence case.

400 · 500 · 600

JetBrains Mono

Code, IDs, receipts, section labels and technical numbers.

jetbrains.com/lp/mono

POST /v1/messages

202 queued → message.sent → message.delivered

01 / section label

04/Usage

Give it room

Use the files as they are. If a version you need is missing, write to us before you draw one.

Clear space

Keep the gap between the mark and the wordmark free on every side: 3/8 of the mark's height.

3/8 h

Smallest size

16 px tall for the lockup, next to small text only. 28 px is the standard size on screen.

lockup · 16 px

mark · 16 px

lockup · 28 px

Don't stretch it

Don't rotate it

Don't recolor it

Don't add effects

Don't put it on busy images

Don't add a phone to it, redraw it or generate a new version with AI. On a photo, use the white version on a calm, dark area.

You can use the logo to link to wuapi or to write about it. Don't use it in a way that suggests we made or endorse your product.

wuapi is an independent service. It is not affiliated with, endorsed or sponsored by WhatsApp. WhatsApp is a trademark of its respective owner.