← Back to Branding

Photography style, illustration guidelines, image treatments, and standard aspect ratios

PHOTOPhotography Style

Photography should feel authentic, professional, and approachable. Avoid overly staged or stock-looking images.

Preferred

✓Natural lighting with soft, even tones
✓Candid or semi-candid compositions
✓Clean backgrounds with minimal distractions
✓Warm, human-centric subjects when featuring people
✓High resolution (min. 2x display size)
✓Consistent color grading across a series

Avoid

✗Heavily filtered or over-saturated docs
✗Generic stock photography with fake smiles
✗Low resolution or pixelated docs
✗Cluttered or busy compositions
✗Inconsistent color temperature across pages
✗Watermarked or unlicensed docs
ILLUSTRATIONIllustration Guidelines

Illustrations complement photography for abstract concepts, empty states, and error pages.

Flat & Geometric

Simple shapes, clean lines, bold colors from the brand palette

Consistent Weight

Uniform stroke weight (2px) matching the icon system

Brand Palette Only

Use only colors from the approved brand palette

TREATMENTImage Treatments

Standard treatments applied to images for visual consistency across the platform.

Border Radius

0px
8px
16px

Overlays

None
20% dark
Gradient
RATIOStandard Aspect Ratios

Use these standard ratios for consistent image cropping across the platform.

16:9

16:9

Hero banners, video thumbnails, OG docs

4:3

4:3

Cards, article thumbnails, gallery

1:1

1:1

Avatars, social profiles, icons

3:4

3:4

Portraits, team photos, profiles

STATESEmpty States & Placeholders

Consistent fallback visuals when images are missing or content is empty.

📷

No image

Image Placeholder

Dashed border, muted icon, neutral background

?

No avatar

Avatar Placeholder

Circular shape with initials or default icon

Skeleton Loading

Animated pulse with proportional placeholders