mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-05-04 22:57:12 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improve some text color contrasts

Browse source
This commit is contained in:
Florine W. Dekker 2022-11-21 15:29:23 +01:00
parent 6188437d1f
commit 885f9816c8
No known key found for this signature in database
GPG key ID: D3DCFAA8A4560BE0
22 changed files with 49 additions and 49 deletions
Download patch file Download diff file Expand all files Collapse all files

12
css/pico.classless.css
View file

@ -207,7 +207,7 @@ kbd {
--h4-color: #374956; --h4-color: #374956;
--h5-color: hsl(205deg, 20%, 32%); --h5-color: hsl(205deg, 20%, 32%);
--h6-color: #4d606d; --h6-color: #4d606d;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 15%, 41%);
--muted-border-color: hsl(205deg, 20%, 94%); --muted-border-color: hsl(205deg, 20%, 94%);
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 90%, 32%); --primary-hover: hsl(195deg, 90%, 32%);
@ -257,7 +257,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: #f6f8f9; --table-row-stripped-background-color: #f6f8f9;
--code-background-color: hsl(205deg, 20%, 94%); --code-background-color: hsl(205deg, 20%, 94%);
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 40%, 50%); --code-tag-color: hsl(330deg, 40%, 50%);
@ -313,7 +313,7 @@ kbd {
--h4-color: #c8d1d8; --h4-color: #c8d1d8;
--h5-color: hsl(205deg, 16%, 77%); --h5-color: hsl(205deg, 16%, 77%);
--h6-color: #afbbc4; --h6-color: #afbbc4;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 12%, 59%);
--muted-border-color: #1f2d38; --muted-border-color: #1f2d38;
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 80%, 50%); --primary-hover: hsl(195deg, 80%, 50%);
@ -363,7 +363,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: rgba(115, 130, 140, 0.05); --table-row-stripped-background-color: rgba(115, 130, 140, 0.05);
--code-background-color: #18232c; --code-background-color: #18232c;
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 30%, 50%); --code-tag-color: hsl(330deg, 30%, 50%);
@ -419,7 +419,7 @@ kbd {
--h4-color: #c8d1d8; --h4-color: #c8d1d8;
--h5-color: hsl(205deg, 16%, 77%); --h5-color: hsl(205deg, 16%, 77%);
--h6-color: #afbbc4; --h6-color: #afbbc4;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 12%, 59%);
--muted-border-color: #1f2d38; --muted-border-color: #1f2d38;
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 80%, 50%); --primary-hover: hsl(195deg, 80%, 50%);
@ -469,7 +469,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: rgba(115, 130, 140, 0.05); --table-row-stripped-background-color: rgba(115, 130, 140, 0.05);
--code-background-color: #18232c; --code-background-color: #18232c;
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 30%, 50%); --code-tag-color: hsl(330deg, 30%, 50%);

2
css/pico.classless.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.classless.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.classless.min.css.map
View file

File diff suppressed because one or more lines are too long

12
css/pico.css
View file

@ -212,7 +212,7 @@ kbd {
--h4-color: #374956; --h4-color: #374956;
--h5-color: hsl(205deg, 20%, 32%); --h5-color: hsl(205deg, 20%, 32%);
--h6-color: #4d606d; --h6-color: #4d606d;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 15%, 41%);
--muted-border-color: hsl(205deg, 20%, 94%); --muted-border-color: hsl(205deg, 20%, 94%);
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 90%, 32%); --primary-hover: hsl(195deg, 90%, 32%);
@ -262,7 +262,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: #f6f8f9; --table-row-stripped-background-color: #f6f8f9;
--code-background-color: hsl(205deg, 20%, 94%); --code-background-color: hsl(205deg, 20%, 94%);
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 40%, 50%); --code-tag-color: hsl(330deg, 40%, 50%);
@ -318,7 +318,7 @@ kbd {
--h4-color: #c8d1d8; --h4-color: #c8d1d8;
--h5-color: hsl(205deg, 16%, 77%); --h5-color: hsl(205deg, 16%, 77%);
--h6-color: #afbbc4; --h6-color: #afbbc4;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 12%, 59%);
--muted-border-color: #1f2d38; --muted-border-color: #1f2d38;
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 80%, 50%); --primary-hover: hsl(195deg, 80%, 50%);
@ -368,7 +368,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: rgba(115, 130, 140, 0.05); --table-row-stripped-background-color: rgba(115, 130, 140, 0.05);
--code-background-color: #18232c; --code-background-color: #18232c;
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 30%, 50%); --code-tag-color: hsl(330deg, 30%, 50%);
@ -424,7 +424,7 @@ kbd {
--h4-color: #c8d1d8; --h4-color: #c8d1d8;
--h5-color: hsl(205deg, 16%, 77%); --h5-color: hsl(205deg, 16%, 77%);
--h6-color: #afbbc4; --h6-color: #afbbc4;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 12%, 59%);
--muted-border-color: #1f2d38; --muted-border-color: #1f2d38;
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 80%, 50%); --primary-hover: hsl(195deg, 80%, 50%);
@ -474,7 +474,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: rgba(115, 130, 140, 0.05); --table-row-stripped-background-color: rgba(115, 130, 140, 0.05);
--code-background-color: #18232c; --code-background-color: #18232c;
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 30%, 50%); --code-tag-color: hsl(330deg, 30%, 50%);

2
css/pico.css.map
View file

File diff suppressed because one or more lines are too long

12
css/pico.fluid.classless.css
View file

@ -207,7 +207,7 @@ kbd {
--h4-color: #374956; --h4-color: #374956;
--h5-color: hsl(205deg, 20%, 32%); --h5-color: hsl(205deg, 20%, 32%);
--h6-color: #4d606d; --h6-color: #4d606d;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 15%, 41%);
--muted-border-color: hsl(205deg, 20%, 94%); --muted-border-color: hsl(205deg, 20%, 94%);
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 90%, 32%); --primary-hover: hsl(195deg, 90%, 32%);
@ -257,7 +257,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: #f6f8f9; --table-row-stripped-background-color: #f6f8f9;
--code-background-color: hsl(205deg, 20%, 94%); --code-background-color: hsl(205deg, 20%, 94%);
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 40%, 50%); --code-tag-color: hsl(330deg, 40%, 50%);
@ -313,7 +313,7 @@ kbd {
--h4-color: #c8d1d8; --h4-color: #c8d1d8;
--h5-color: hsl(205deg, 16%, 77%); --h5-color: hsl(205deg, 16%, 77%);
--h6-color: #afbbc4; --h6-color: #afbbc4;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 12%, 59%);
--muted-border-color: #1f2d38; --muted-border-color: #1f2d38;
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 80%, 50%); --primary-hover: hsl(195deg, 80%, 50%);
@ -363,7 +363,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: rgba(115, 130, 140, 0.05); --table-row-stripped-background-color: rgba(115, 130, 140, 0.05);
--code-background-color: #18232c; --code-background-color: #18232c;
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 30%, 50%); --code-tag-color: hsl(330deg, 30%, 50%);
@ -419,7 +419,7 @@ kbd {
--h4-color: #c8d1d8; --h4-color: #c8d1d8;
--h5-color: hsl(205deg, 16%, 77%); --h5-color: hsl(205deg, 16%, 77%);
--h6-color: #afbbc4; --h6-color: #afbbc4;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 12%, 59%);
--muted-border-color: #1f2d38; --muted-border-color: #1f2d38;
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 80%, 50%); --primary-hover: hsl(195deg, 80%, 50%);
@ -469,7 +469,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: rgba(115, 130, 140, 0.05); --table-row-stripped-background-color: rgba(115, 130, 140, 0.05);
--code-background-color: #18232c; --code-background-color: #18232c;
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 30%, 50%); --code-tag-color: hsl(330deg, 30%, 50%);

2
css/pico.fluid.classless.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.fluid.classless.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.fluid.classless.min.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.min.css.map
View file

File diff suppressed because one or more lines are too long

12
css/pico.slim.css
View file

@ -143,7 +143,7 @@ kbd {
--h4-color: #374956; --h4-color: #374956;
--h5-color: hsl(205deg, 20%, 32%); --h5-color: hsl(205deg, 20%, 32%);
--h6-color: #4d606d; --h6-color: #4d606d;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 15%, 41%);
--muted-border-color: hsl(205deg, 20%, 94%); --muted-border-color: hsl(205deg, 20%, 94%);
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 90%, 32%); --primary-hover: hsl(195deg, 90%, 32%);
@ -193,7 +193,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: #f6f8f9; --table-row-stripped-background-color: #f6f8f9;
--code-background-color: hsl(205deg, 20%, 94%); --code-background-color: hsl(205deg, 20%, 94%);
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 40%, 50%); --code-tag-color: hsl(330deg, 40%, 50%);
@ -249,7 +249,7 @@ kbd {
--h4-color: #c8d1d8; --h4-color: #c8d1d8;
--h5-color: hsl(205deg, 16%, 77%); --h5-color: hsl(205deg, 16%, 77%);
--h6-color: #afbbc4; --h6-color: #afbbc4;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 12%, 59%);
--muted-border-color: #1f2d38; --muted-border-color: #1f2d38;
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 80%, 50%); --primary-hover: hsl(195deg, 80%, 50%);
@ -299,7 +299,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: rgba(115, 130, 140, 0.05); --table-row-stripped-background-color: rgba(115, 130, 140, 0.05);
--code-background-color: #18232c; --code-background-color: #18232c;
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 30%, 50%); --code-tag-color: hsl(330deg, 30%, 50%);
@ -355,7 +355,7 @@ kbd {
--h4-color: #c8d1d8; --h4-color: #c8d1d8;
--h5-color: hsl(205deg, 16%, 77%); --h5-color: hsl(205deg, 16%, 77%);
--h6-color: #afbbc4; --h6-color: #afbbc4;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 12%, 59%);
--muted-border-color: #1f2d38; --muted-border-color: #1f2d38;
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 80%, 50%); --primary-hover: hsl(195deg, 80%, 50%);
@ -405,7 +405,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: rgba(115, 130, 140, 0.05); --table-row-stripped-background-color: rgba(115, 130, 140, 0.05);
--code-background-color: #18232c; --code-background-color: #18232c;
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 30%, 50%); --code-tag-color: hsl(330deg, 30%, 50%);

2
css/pico.slim.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.slim.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.slim.min.css.map
View file

File diff suppressed because one or more lines are too long

12
css/themes/default.css
View file

@ -207,7 +207,7 @@ kbd {
--h4-color: #374956; --h4-color: #374956;
--h5-color: hsl(205deg, 20%, 32%); --h5-color: hsl(205deg, 20%, 32%);
--h6-color: #4d606d; --h6-color: #4d606d;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 15%, 41%);
--muted-border-color: hsl(205deg, 20%, 94%); --muted-border-color: hsl(205deg, 20%, 94%);
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 90%, 32%); --primary-hover: hsl(195deg, 90%, 32%);
@ -257,7 +257,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: #f6f8f9; --table-row-stripped-background-color: #f6f8f9;
--code-background-color: hsl(205deg, 20%, 94%); --code-background-color: hsl(205deg, 20%, 94%);
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 40%, 50%); --code-tag-color: hsl(330deg, 40%, 50%);
@ -313,7 +313,7 @@ kbd {
--h4-color: #c8d1d8; --h4-color: #c8d1d8;
--h5-color: hsl(205deg, 16%, 77%); --h5-color: hsl(205deg, 16%, 77%);
--h6-color: #afbbc4; --h6-color: #afbbc4;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 12%, 59%);
--muted-border-color: #1f2d38; --muted-border-color: #1f2d38;
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 80%, 50%); --primary-hover: hsl(195deg, 80%, 50%);
@ -363,7 +363,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: rgba(115, 130, 140, 0.05); --table-row-stripped-background-color: rgba(115, 130, 140, 0.05);
--code-background-color: #18232c; --code-background-color: #18232c;
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 30%, 50%); --code-tag-color: hsl(330deg, 30%, 50%);
@ -419,7 +419,7 @@ kbd {
--h4-color: #c8d1d8; --h4-color: #c8d1d8;
--h5-color: hsl(205deg, 16%, 77%); --h5-color: hsl(205deg, 16%, 77%);
--h6-color: #afbbc4; --h6-color: #afbbc4;
--muted-color: hsl(205deg, 10%, 50%); --muted-color: hsl(205deg, 12%, 59%);
--muted-border-color: #1f2d38; --muted-border-color: #1f2d38;
--primary: hsl(195deg, 85%, 41%); --primary: hsl(195deg, 85%, 41%);
--primary-hover: hsl(195deg, 80%, 50%); --primary-hover: hsl(195deg, 80%, 50%);
@ -469,7 +469,7 @@ kbd {
--table-border-color: var(--muted-border-color); --table-border-color: var(--muted-border-color);
--table-row-stripped-background-color: rgba(115, 130, 140, 0.05); --table-row-stripped-background-color: rgba(115, 130, 140, 0.05);
--code-background-color: #18232c; --code-background-color: #18232c;
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: hsl(330deg, 30%, 50%); --code-tag-color: hsl(330deg, 30%, 50%);

2
css/themes/default.css.map
View file

File diff suppressed because one or more lines are too long

2
css/themes/default.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/themes/default.min.css.map
View file

File diff suppressed because one or more lines are too long

4
scss/themes/default/_dark.scss
View file

@ -14,7 +14,7 @@
--h6-color: #{mix($grey-300, $grey-200)}; --h6-color: #{mix($grey-300, $grey-200)};
// Muted colors // Muted colors
--muted-color: #{$grey-500}; --muted-color: #{$grey-400};
--muted-border-color: #{mix($grey-900, $grey-800, 75%)}; --muted-border-color: #{mix($grey-900, $grey-800, 75%)};
// Primary colors // Primary colors
@ -90,7 +90,7 @@
// Code // Code
--code-background-color: #{mix($black, $grey-900, 12.5%)}; --code-background-color: #{mix($black, $grey-900, 12.5%)};
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: #{hsl(330, 30%, 50%)}; --code-tag-color: #{hsl(330, 30%, 50%)};

4
scss/themes/default/_light.scss
View file

@ -15,7 +15,7 @@
--h6-color: #{mix($grey-700, $grey-600)}; --h6-color: #{mix($grey-700, $grey-600)};
// Muted colors // Muted colors
--muted-color: #{$grey-500}; --muted-color: #{$grey-600};
--muted-border-color: #{$grey-50}; --muted-border-color: #{$grey-50};
// Primary colors // Primary colors
@ -91,7 +91,7 @@
// Code // Code
--code-background-color: #{$grey-50}; --code-background-color: #{$grey-50};
--code-color: var(--muted-color); --code-color: var(--color);
--code-kbd-background-color: var(--contrast); --code-kbd-background-color: var(--contrast);
--code-kbd-color: var(--contrast-inverse); --code-kbd-color: var(--contrast-inverse);
--code-tag-color: #{hsl(330, 40%, 50%)}; --code-tag-color: #{hsl(330, 40%, 50%)};