1 Introduction

Welcome to the Zebralyzer

Is your foreground color popping like a zebra? Or is it blending like a chameleon? We're about to find out.

Drop a color JSON file here...
...or click Next Step to proceed with defaults.
Drop the file here.
Color palette:
Font size import coming soon.
Next Step
Choose your font size

2 Choose Font Size

Choose your font size

Font size is important when evaluating contrast. Large or bold fonts let you use more muted colors.

body-s (12/16)
body-m (14/20)
body-l (16/20)
body-xl (19/24)
heading-s (24/28)
heading-m (28/32)
heading-l (36/40)
heading-xl (44/48)

3 Choose Colors

Choose your colors

Pick a background, then a foreground. We'll hide any choices that are too muted for text.

Background Color

Foreground Color

AAA choices

AA choices

All colors

4 Results

How vexingly quick daft zebras jump!