AV-007 · J. Avatars and Illustrations

Humaaans

Mix-and-match vector people illustrations (bodies, hair, tops, pants, poses) for onboarding, empty states and marketing. Link-only here.

Summary

Mix-and-match vector people illustrations (bodies, hair, tops, pants, poses) for onboarding, empty states and marketing. Link-only here.

What it is

A library of illustrations for product UI and marketing.

Who it’s for

Designers who need empty-state, onboarding or marketing illustrations with a clear license.

Vibrant gradient Split heroBold, illustrative

Humaaans: hero image — Rendered by us from the ESTIMATED palette of our capture; no third-party artwork reproduced.

Key takeaways

Captured humaaans.com: oversized illustrated people overlapping the headline, saturated blue and warm skin tones on white.
Color: vibrant gradient theme; dominant colors #FFFFFF, #A46C46, #384BE7 (ESTIMATED from our capture).
Layout: split hero pattern, bold, illustrative mood.

Best practices to borrow

Save gradients for hero moments; keep body sections calm.
Put the promise on one side and proof (product, media or illustration) on the other; keep the headline short.
Keep one illustration style across the product and recolor it to your palette where allowed.

ESTIMATED

Palette preview

#FFFFFF~63%#A46C46~6%#384BE7~5%#000000~5%#9FBAC0~5%#27277C~4%

Quick links

Source DESIGN.md

How to use

Download the library (Figma/Sketch/Studio) and swap components; or use it inside Blush.

Link-only entry: no third-party images are reproduced; the hero above is our own palette render. Open the source for visuals.

Related entries

AV-010 · Illustration Library

ESTIMATED

Dominant palette from our captures

Measured by us from our screenshot(s) of https://www.humaaans.com/ (median-cut quantization; share = % of pixels). Approximate and not official.

#FFFFFF~63% of pixels#A46C46~6% of pixels#384BE7~5% of pixels#000000~5% of pixels#9FBAC0~5% of pixels#27277C~4% of pixels

Layout pattern: Split hero

Observed by us on the captured page(s). See all entries by layout.

How to apply it: Put the promise on one side and proof (product, media or illustration) on the other; keep the headline short.

Other entries with this layout: Material Design 3, Heroicons, Phosphor Icons, Linear, Stripe, Notion, DiceBear, Open Peeps, Blush, Linear onboarding flow.

Our analysis

Captured humaaans.com: oversized illustrated people overlapping the headline, saturated blue and warm skin tones on white.

Vibrant gradient Split heroBold, illustrative

Similar to this

Ranked by shared color theme, layout, category, type and mood tags.

AV-010 · Illustration Library

Blush

PastelSplit hero

AV-006 · Illustration Library

Open Peeps

High-contrastSplit hero

WR-002 · Website Reference

Stripe

Vibrant gradientSplit hero

AV-001 · Avatar Library

DiceBear

Monochrome lightSplit hero

Downloads

DESIGN.md

License / terms of the source: CC0 (public domain), by Pablo Stanley

DESIGN.md for AI coding agents

Copy this into your repo or agent context. OFFICIAL and ESTIMATED values are labelled.

Download .md All entries

# DESIGN.md · Humaaans (AV-007)

> Written for AI coding agents. Values marked **OFFICIAL** come from the documented source named below; values marked **ESTIMATED** were measured by us from our own screenshots and are approximate. Never treat ESTIMATED values as official brand tokens.

## Overview
- Type: Illustration Library · Category: J. Avatars and Illustrations
- Platforms: Web
- Color theme: Vibrant gradient · Layout pattern: Split hero · Mood: Bold, illustrative
- License / terms: CC0 (public domain), by Pablo Stanley

Mix-and-match vector people illustrations (bodies, hair, tops, pants, poses) for onboarding, empty states and marketing. Link-only here.

### Analysis (ours)
Captured humaaans.com: oversized illustrated people overlapping the headline, saturated blue and warm skin tones on white.

## Color tokens
No official color tokens documented for this entry.

ESTIMATED · dominant colors measured from our screenshot(s) of the source site (median-cut quantization; share = % of pixels). Approximate, not official:

- `#FFFFFF` ~63%
- `#A46C46` ~6%
- `#384BE7` ~5%
- `#000000` ~5%
- `#9FBAC0` ~5%
- `#27277C` ~4%

## Typography
No official type scale documented for this entry; use the product’s own typography guidance.

## Spacing, radii, shadows
Not documented for this entry. Do not invent values; derive from your own design system.

## Components
No component inventory documented for this entry.

## Layout rules
- Observed layout pattern: **Split hero** (from our captures).

## Usage
```
Download the library (Figma/Sketch/Studio) and swap components; or use it inside Blush.
```

## Do’s and don’ts
- Do: Reserve gradients for hero/feature moments; keep body sections calm.
- Don’t: Don’t put body text on busy gradients without a contrast check.
- Do: follow the source’s license/terms listed above.
- Don’t: present ESTIMATED colors as official tokens.

## Sources
- https://www.humaaans.com/
- Library entry: https://design-library-byt.pages.dev/entry/AV-007