diff --git a/src/contents/predefined-color-schemes.md b/src/contents/predefined-color-schemes.md new file mode 100644 index 0000000..70f2639 --- /dev/null +++ b/src/contents/predefined-color-schemes.md @@ -0,0 +1,101 @@ +--- +author: Sat Naing +datetime: 2022-09-26T12:13:24Z +title: Predefined color schemes +slug: predefined-color-schemes +featured: false +draft: false +tags: + - color-schemes +ogImage: "" +description: + Some of the well-crafted, predefined color schemes for AstroPaper blog + theme. +--- + +I've crafted some predefined color schemes for this AstroPaper blog theme. You can replace these color schemes with the original ones. + +## Table of contents + +## Light color schemes + +Light color scheme has to be defined as `:root`. + +### Lobster + +![lobster-color-scheme](https://user-images.githubusercontent.com/53733092/192282447-1d222faf-a3ce-44a9-9cfe-ac873155e5a9.png) + +```css +:root { + --color-fill: 246, 238, 225; + --color-text-base: 1, 44, 86; + --color-accent: 225, 74, 57; + --color-card: 217, 209, 195; + --color-card-muted: 239, 216, 176; + --color-border: 220, 152, 145; +} +``` + +### Leaf Blue + +![leaf-blue-color-scheme](https://user-images.githubusercontent.com/53733092/192318782-e80e3c39-54b5-423e-8f4b-9ae60402fc8d.png) + +```css +:root { + --color-fill: 242, 245, 236; + --color-text-base: 53, 53, 56; + --color-accent: 17, 88, 209; + --color-card: 206, 213, 180; + --color-card-muted: 187, 199, 137; + --color-border: 124, 173, 255; +} +``` + +### Pinky light + +![pinky-color-scheme](https://user-images.githubusercontent.com/53733092/192286510-892d0042-2d6d-471e-bb72-954221ae2d17.png) + +```css +:root { + --color-fill: 250, 252, 252; + --color-text-base: 34, 46, 54; + --color-accent: 211, 0, 106; + --color-card: 234, 206, 219; + --color-card-muted: 241, 186, 212; + --color-border: 227, 169, 198; +} +``` + +## Dark color schemes + +Light color scheme has to be defined as `.theme-dark`. + +### Deep Oyster + +![deep-oyster-color-scheme](https://user-images.githubusercontent.com/53733092/192314524-45ec5904-3d8f-450a-9edf-1e32c5e11d6c.png) + +```css +.theme-dark { + --color-fill: 33, 35, 61; + --color-text-base: 244, 247, 245; + --color-accent: 255, 82, 86; + --color-card: 57, 60, 102; + --color-card-muted: 74, 78, 134; + --color-border: 177, 47, 50; +} +``` + +### Pikky dark + +![pinky-dark-color-scheme](https://user-images.githubusercontent.com/53733092/192307050-fbd55326-911c-4001-87c6-a8ad9378ac2e.png) + +```css +.theme-dark { + --color-fill: 53, 54, 64; + --color-text-base: 233, 237, 241; + --color-accent: 255, 120, 200; + --color-card: 75, 76, 89; + --color-card-muted: 113, 85, 102; + --color-border: 134, 67, 107; +} +```