Highlighting colors

Testing out contrast for colors for syntax highlighting.

Night-owlish color swatches

Testing color swatches for a with a minimum color-contrast ratio of 4.5 (per WCAG 2.1 color-contrast standards for Level AA) using the code from Bootstrap 5.3 docs on color-palette classes. As described in the Boostrap color docs, the swatches show three contrast ratios: “one for the swatch’s current colors, one for against white, and one for against black.” The top color in these swatches (the text color) is the background color used for the Night Owl theme by Sarah Drasner, #011627.

$whitish

$lime

$periwinkle

$owl-purple

$owl-pink

$mint

$hotpink

$tangerine

$pale-green

$owl-gray

$blue-gray

$red-muted

$owl-blue

$yellow-dark

$marigold

Back to top