Link Search Menu Expand Document

Color Utilities

Table of contents

  1. Light Greys
  2. Dark Greys
  3. Purples
  4. Blues
  5. Greens
  6. Yellows
  7. Reds

All the colors used in Just the Docs have been systematized into a series of variables that have been extended to both font color and background color utility classes.

Light Greys

Color valueFont color utilityBackground color utility
grey-lt-000.text-grey-lt-000.bg-grey-lt-000
grey-lt-100.text-grey-lt-100.bg-grey-lt-100
grey-lt-200.text-grey-lt-200.bg-grey-lt-200
grey-lt-300.text-grey-lt-300.bg-grey-lt-300

Dark Greys

Color valueFont color utilityBackground color utility
grey-dk-000.text-grey-dk-000.bg-grey-dk-000
grey-dk-100.text-grey-dk-100.bg-grey-dk-100
grey-dk-200.text-grey-dk-200.bg-grey-dk-200
grey-dk-250.text-grey-dk-250.bg-grey-dk-250
grey-dk-300.text-grey-dk-300.bg-grey-dk-300

Purples

Color valueFont color utilityBackground color utility
purple-000.text-purple-000.bg-purple-000
purple-100.text-purple-100.bg-purple-100
purple-200.text-purple-200.bg-purple-200
purple-300.text-purple-300.bg-purple-300

Blues

Color valueFont color utilityBackground color utility
blue-000.text-blue-000.bg-blue-000
blue-100.text-blue-100.bg-blue-100
blue-200.text-blue-200.bg-blue-200
blue-300.text-blue-300.bg-blue-300

Greens

Color valueFont color utilityBackground color utility
green-000.text-green-000.bg-green-000
green-100.text-green-100.bg-green-100
green-200.text-green-200.bg-green-200
green-300.text-green-300.bg-green-300

Yellows

Color valueFont color utilityBackground color utility
yellow-000.text-yellow-000.bg-yellow-000
yellow-100.text-yellow-100.bg-yellow-100
yellow-200.text-yellow-200.bg-yellow-200
yellow-300.text-yellow-300.bg-yellow-300

Reds

Color valueFont color utilityBackground color utility
red-000.text-red-000.bg-red-000
red-100.text-red-100.bg-red-100
red-200.text-red-200.bg-red-200
red-300.text-red-300.bg-red-300

Back to top

Copyright © 2021 Manuel Weiss and Karl Hughes. All rights reserved.