Kindle display test

For an older Paperwhite browser. Scroll slowly. Judge size, sharpness, and which grays still separate.

If everything is tiny, the browser ignored the viewport tag and laid the page out wide, then shrank it. Pinch-zoom, or use the browser text-size control, then keep reading.

This browser

JavaScript did not run.

Width bars

Each bar is a fixed number of CSS pixels. A bar that fits is narrower than the window.

600 CSS px
758 CSS px (Paperwhite 1 and 2 panel)
1072 CSS px (Paperwhite 3 panel)

Type

If one CSS pixel is one device pixel, 32px is about 11pt on a 212 ppi screen and about 8pt on a 300 ppi screen. 42px is about 10pt at 300 ppi.

18px serif. The quick brown fox jumps.

24px serif. The quick brown fox jumps.

32px serif. The quick brown fox.

42px serif. Brown fox.

56px serif.

18px sans-serif. The quick brown fox jumps.

24px sans-serif. The quick brown fox jumps.

32px sans-serif. The quick brown fox.

42px sans-serif. Brown fox.

Bold serif at 28px.

Italic serif at 28px.

Bold sans at 28px.

Italic sans at 28px.

18px monospace. 0123456789 Il1 O0

It is a truth universally acknowledged, that a single man in possession of a good fortune, must be in want of a wife. However little known the feelings or views of such a man may be on his first entering a neighbourhood, this truth is so well fixed in the minds of the surrounding families, that he is considered the rightful property of some one or other of their daughters.

Same paragraph in sans-serif at 32px. It is a truth universally acknowledged, that a single man in possession of a good fortune, must be in want of a wife.

Same opening at 42px serif. It is a truth universally acknowledged, that a single man in possession of a good fortune, must be in want of a wife.

Gray steps

On e-ink, neighbors often merge. Note the last step you can still tell apart.

#000
#222
#444
#666
#888
#aaa
#ccc
#eee
#fff

Same ramp as a PNG, 288 by 48 pixels, shown at its own size.

Gray ramp image

Black field

White text on a black field. E-ink often flashes here, and the black can look uneven or ghosted after you scroll.

Lines

Hairlines often drop out or turn fuzzy.

1px CSS bar

2px CSS bar

4px CSS bar

1px solid border around this box.
2px solid border around this box.

PNG rules, top to bottom: 1px, 2px, 3px, 4px. Image is 320 by 88.

Rule thicknesses in a PNG

Images

Checker, 8px squares, 160 by 80, shown at its own size. Blur here means the browser scaled it.

Checkerboard

Same checker drawn at twice the width (320).

Checkerboard scaled up

Bayer dither, black on the left, white on the right. 160 by 64, own size.

Bayer dither gradient

Same dither at twice the width. Smoothing means the browser filtered it.

Bayer dither scaled up

Inline SVG. If the next line is blank, SVG did not draw.

SVG text on black

Canvas. The script paints this. A blank box means canvas did not draw.

Layout

Side by side means that layout worked. Stacked means the browser ignored it.

Float left.
Float right.
Flex A
Flex B
Grid A
Grid B

Controls

Link to page 2

Link to the black field on this page

Blue link, unstyled weight. Often turns into a faint gray.

End of test. 2026-10-03.