diff --git a/src/content/posts/_color-schemes/assets/ember.png b/src/content/posts/_color-schemes/assets/ember.png deleted file mode 100644 index fd8ed79..0000000 Binary files a/src/content/posts/_color-schemes/assets/ember.png and /dev/null differ diff --git a/src/content/posts/_color-schemes/assets/espresso.png b/src/content/posts/_color-schemes/assets/espresso.png deleted file mode 100644 index 056c20c..0000000 Binary files a/src/content/posts/_color-schemes/assets/espresso.png and /dev/null differ diff --git a/src/content/posts/_color-schemes/assets/jadeite.png b/src/content/posts/_color-schemes/assets/jadeite.png deleted file mode 100644 index 404e39f..0000000 Binary files a/src/content/posts/_color-schemes/assets/jadeite.png and /dev/null differ diff --git a/src/content/posts/_color-schemes/assets/kha-yan.png b/src/content/posts/_color-schemes/assets/kha-yan.png deleted file mode 100644 index c9740ae..0000000 Binary files a/src/content/posts/_color-schemes/assets/kha-yan.png and /dev/null differ diff --git a/src/content/posts/_color-schemes/assets/nila.png b/src/content/posts/_color-schemes/assets/nila.png deleted file mode 100644 index c09ac32..0000000 Binary files a/src/content/posts/_color-schemes/assets/nila.png and /dev/null differ diff --git a/src/content/posts/_color-schemes/assets/paper-light.png b/src/content/posts/_color-schemes/assets/paper-light.png deleted file mode 100644 index 876cc09..0000000 Binary files a/src/content/posts/_color-schemes/assets/paper-light.png and /dev/null differ diff --git a/src/content/posts/_color-schemes/assets/pyit-tine-htaung.png b/src/content/posts/_color-schemes/assets/pyit-tine-htaung.png deleted file mode 100644 index b34a238..0000000 Binary files a/src/content/posts/_color-schemes/assets/pyit-tine-htaung.png and /dev/null differ diff --git a/src/content/posts/_color-schemes/predefined-color-schemes.mdx b/src/content/posts/_color-schemes/predefined-color-schemes.mdx deleted file mode 100644 index 85be30e..0000000 --- a/src/content/posts/_color-schemes/predefined-color-schemes.mdx +++ /dev/null @@ -1,235 +0,0 @@ ---- -author: Sat Naing -pubDatetime: 2022-09-26T12:13:24Z -modDatetime: 2026-05-16T11:29:26.658Z -title: Predefined color schemes -slug: predefined-color-schemes -featured: false -draft: false -tags: - - color-schemes -description: - Some of the well-crafted, updated predefined color schemes for AstroPaper. - ---- - -import ResponsiveTable from '@/components/ResponsiveTable.astro'; - -AstroPaper includes a collection of predefined color schemes that can be applied to customize the theme appearance. Each scheme defines a complete set of CSS custom properties (variables) for light and dark modes. - -## Table of contents - -## Quick Start - -To apply a predefined color scheme, copy the CSS variable definitions into your theme configuration. For detailed setup instructions, see the [color scheme configuration guide](https://astro-paper.pages.dev/posts/customizing-astropaper-theme-color-schemes/). - -## CSS Variables Reference - -All color schemes use the following CSS custom properties: - - - -| Variable | Purpose | -| --------------------- | -------------------------------------------------------- | -| `--background` | Primary background color | -| `--foreground` | Primary text color | -| `--accent` | Accent/interactive elements (links, buttons, highlights) | -| `--accent-foreground` | Text color on accent backgrounds | -| `--muted` | Secondary background color for subtle sections | -| `--muted-foreground` | Text color for secondary content | -| `--border` | Border and divider color | - - - -## Light Schemes - -Light color schemes are defined using the CSS selectors `:root` and `[data-theme="light"]`. - -### Paper Light - -Default AstroPaper light theme. - -![Paper Light](assets/paper-light.png) - -```css -:root, -[data-theme="light"] { - --background: #fdfdfd; - --foreground: #282728; - --accent: #006cac; - --accent-foreground: #ffffff; - --muted: #e6e6e6; - --muted-foreground: #6b7280; - --border: #ece9e9; -} -``` - -### Kha-Yan - -Purple-focused light scheme with warm background. - -![Kha-Yan](assets/kha-yan.png) - -```css -:root, -[data-theme="light"] { - --background: #fefaec; - --foreground: #120e01; - --accent: #6e10cf; - --accent-foreground: #fefaec; - --muted: #dcdcdc; - --muted-foreground: #6b7280; - --border: #cdc4d6; -} -``` - -### Nila - -Light purple scheme with cool blue undertones. - -![Nila](assets/nila.png) - -```css -:root, -[data-theme="light"] { - --background: #f6f6fb; - --foreground: #0c0c19; - --accent: #6760b4; - --accent-foreground: #f3f3f3; - --muted: #dddcea; - --muted-foreground: #54515b; - --border: #d8d6ec; -} -``` - -### Jadeite - -Teal-accented light scheme with neutral background. - -![Jadeite](assets/jadeite.png) - -```css -:root, -[data-theme="light"] { - --background: #f6fcf7; - --foreground: #060b07; - --accent: #027c6d; - --accent-foreground: #ffffff; - --muted: #c9e4e2; - --muted-foreground: #6b7280; - --border: #d4e1df; -} -``` - -### Pyit Tine Htaung - -Red and gold accent scheme with warm tones. - -![Pyit Tine Htaung](assets/pyit-tine-htaung.png) - -```css -:root, -[data-theme="light"] { - --background: #fffaf6; - --foreground: #060503; - --accent: #aa0215; - --accent-foreground: #ffcf75; - --muted: #ffdc98; - --muted-foreground: #54515b; - --border: #ffdc98; -} -``` - -## Dark Schemes - -Dark color schemes are defined using the CSS selector `[data-theme="dark"]`. - -### Paper Dark - -Original AstroPaper dark theme with cyan accents. - -![AstroPaper 1 default dark theme](https://user-images.githubusercontent.com/53733092/215769153-13b0ad8d-5ba2-44b1-af06-e5ae61293f62.png) - -```css -[data-theme="dark"] { - --background: #2f3741; - --foreground: #e6e6e6; - --accent: #1ad9d9; - --accent-foreground: #0d2b2b; - --muted: #596b81; - --muted-foreground: #8faabb; - --border: #3b4655; -} -``` - -### Paper Dark II - -Current default dark theme with orange accents. - -![new dark color scheme - low contrast](https://user-images.githubusercontent.com/53733092/215772856-d5b7ae35-ddaa-4ed6-b0bf-3fa5dbcf834c.png) - -```css -[data-theme="dark"] { - --background: #212737; - --foreground: #eaedf3; - --accent: #ff6b01; - --accent-foreground: #ffffff; - --muted: #343f60; - --muted-foreground: #afb9ca; - --border: #ab4b08; -} -``` - -### Deep Purple - -Vibrant magenta accents dark scheme. - -![AstroPaper v3 new theme](https://github.com/satnaing/astro-paper/assets/53733092/c8b5d7e1-a3bc-4852-a5ad-4abf7b3cec79) - -```css -[data-theme="dark"] { - --background: #212737; - --foreground: #eaedf3; - --accent: #eb3fd3; - --accent-foreground: #1a0d1a; - --muted: #513f51; - --muted-foreground: #c09abc; - --border: #642451; -} -``` - -### Ember - -Warm, muted dark scheme with red accents. - -![Ember](assets/ember.png) - -```css -[data-theme="dark"] { - --background: #1a1a1a; - --foreground: #f5efe4; - --accent: #ff3737; - --accent-foreground: #1a1a1a; - --muted: #38342f; - --muted-foreground: #a59a8c; - --border: #6f5648; -} -``` - -### Espresso - -Brown-focused warm dark scheme. - -![Coffee](assets/espresso.png) - -```css -[data-theme="dark"] { - --background: #2f2f2f; - --foreground: #ebe5e1; - --accent: #ee781e; - --accent-foreground: #1a1a1a; - --muted: #4f4b44; - --muted-foreground: #ddbfa7; - --border: #6f5648; -} -```