1
0
mirror of https://github.com/thangisme/notes.git synced 2024-12-22 13:06:27 -05:00
notes/docs/utilities/color.md
EricFromCanada 2218e6e565 Fix links and syntax
For pages in utilities/, reorder `nav_order` to follow `parent`.
2019-01-14 14:43:33 -05:00

5.0 KiB

layout title parent nav_order
default Color Utilities 3

Color Utilities

{: .no_toc }

Table of contents

{: .no_toc .text-delta }

  1. TOC {:toc}

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 value Font color utility Background 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 value Font color utility Background 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 value Font color utility Background 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 value Font color utility Background 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 value Font color utility Background 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 value Font color utility Background 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 value Font color utility Background 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