Like 0
Fork 0

Last active 1 month ago

Rose Pine color palettes for Ellipsus

ellipsus userstyles

veryroundbird's Avatar veryroundbird revised this gist 1 month ago. Go to revision

2 files changed, 127 insertions, 8 deletions

rose pine dawn.css (file created)

@@ -0,0 +1,119 @@
1 + /* Ellipsus Theme | Schema: 1 */
2 + :root {
3 + --color-surface-main: #faf4ed;
4 + --color-surface-writing: #fffaf3;
5 + --color-surface-primary: #f2e9e1;
6 + --color-surface-neutral: #fffaf3;
7 + --color-surface-light: #fffaf3;
8 + --color-surface-dim: #f2e9e1;
9 + --color-surface-alt: #f2e9e1;
10 + --color-surface-inverted: #d7827e;
11 + --color-content-primary: #464261;
12 + --color-content-secondary: #d7827e;
13 + --color-content-tertiary: #797593;
14 + --color-content-disabled: #9893a5;
15 + --color-content-light: #56949f;
16 + --color-content-light-2: #b4637a;
17 + --color-content-dark: #797593;
18 + --color-content-inverted: #faf4ed;
19 + --color-border-primary: #9893a5;
20 + --color-border-secondary: #dfdad9;
21 + --color-border-tertiary: #f4ede8;
22 + --color-border-inverted: #464261;
23 + --color-border-disabled: #f4ede8;
24 + --button-primary-surface: #286983;
25 + --button-primary-surface-hover: #3a98be;
26 + --button-primary-surface-pressed: #1e5064;
27 + --button-primary-surface-disabled: #789ead;
28 + --button-primary-content: #faf4ed;
29 + --button-primary-content-pressed: #fffaf3;
30 + --button-primary-content-disabled: #cecacd;
31 + --button-surface: transparent;
32 + --button-surface-hover: #fffaf3;
33 + --button-surface-pressed: #ffefda;
34 + --button-surface-disabled: transparent;
35 + --button-border: #797593;
36 + --button-border-hover: #464261;
37 + --button-border-pressed: #d7827e;
38 + --button-border-disabled: #9893a5;
39 + --button-content: #797593;
40 + --button-content-hover: #464261;
41 + --button-content-pressed: #d7827e;
42 + --button-content-disabled: #9893a5;
43 + --button-primary-alt-surface: #ea9d34;
44 + --button-primary-alt-surface-hover: #ffffff;
45 + --button-primary-alt-surface-pressed: #fdfaf5;
46 + --button-primary-alt-surface-disabled: #e3cfbd;
47 + --button-primary-alt-content: #464261;
48 + --button-primary-alt-content-pressed: #262626;
49 + --button-primary-alt-content-disabled: #757575;
50 + --button-surface-alt: transparent;
51 + --button-surface-hover-alt: #ffffff;
52 + --button-surface-pressed-alt: #eadccf;
53 + --button-surface-disabled-alt: transparent;
54 + --button-border-alt: #555555;
55 + --button-border-hover-alt: #888888;
56 + --button-border-pressed-alt: #555555;
57 + --button-border-disabled-alt: #9f9f9f;
58 + --button-content-alt: #1e150d;
59 + --button-content-hover-alt: #65472c;
60 + --button-content-pressed-alt: #1e150d;
61 + --button-content-disabled-alt: #808080;
62 + --color-surface-error: #a11b24;
63 + --color-content-error: #d7827e;
64 + --color-border-error: #b81a14;
65 + --color-surface-success: #074057;
66 + --color-content-success: #286983;
67 + --color-border-success: #057b40;
68 + --color-surface-idle: #56949f;
69 + --color-content-idle: #1f5963;
70 + --color-surface-warning: #b56800;
71 + --color-content-warning: #ea9d34;
72 + --button-error-primary-surface: #e73d36;
73 + --button-error-primary-surface-hover: #ef7f7a;
74 + --button-error-primary-surface-pressed: #da221a;
75 + --button-error-surface: transparent;
76 + --button-error-surface-hover: #ffffff;
77 + --button-error-surface-pressed: #fbf0ef;
78 + --button-error-border: #e73d36;
79 + --button-error-border-hover: #ef7f7a;
80 + --button-error-border-pressed: #da221a;
81 + --button-error-content: #e73d36;
82 + --button-error-content-hover: #ef7f7a;
83 + --button-error-content-pressed: #da221a;
84 + --color-system-highlight-selection: #dfdad9;
85 + --color-system-highlight-comment-idle: #facb8c;
86 + --color-system-highlight-comment-active: #ea9d34;
87 + --color-system-highlight-comment-resolved: #f4ede8;
88 + --color-highlighter-purple: #d6cae3;
89 + --color-highlighter-blue: #bad1e0;
90 + --color-highlighter-cyan: #bad9de;
91 + --color-highlighter-green: #D4EDDA;
92 + --color-highlighter-yellow: #facc8e;
93 + --color-highlighter-orange: #FFE0CC;
94 + --color-highlighter-coral: #ebc5c3;
95 + --color-highlighter-pink: #deb1be;
96 + --color-highlighter-grey: #f4ede8;
97 + --color-brand-purple: #c455eb;
98 + --color-brand-purple-inverted: #dc78ff;
99 + --color-brand-blue-alt: #6ab8ff;
100 + --color-brand-blue: #2173be;
101 + --color-brand-blue-inverted: #6ab8ff;
102 + --color-brand-coral: #eb5b55;
103 + --color-brand-coral-inverted: #fe6862;
104 + --color-brand-orange: #f09236;
105 + --color-brand-orange-inverted: #ffad5c;
106 + --color-brand-green: #529a6a;
107 + --color-brand-green-inverted: #56c87c;
108 + --color-content-link: #d7827e;
109 + --color-graphics-1: #e6fbff;
110 + --color-graphics-2: #b3dce3;
111 + --color-graphics-3: #85bdc7;
112 + --color-graphics-4: #56949f;
113 + --shadow-color: #464261;
114 + --shadow-xs: 0px 0px 8px 0px rgb(70 66 97 / 8%);
115 + --shadow-s: 0px 0px 12px 0px rgb(70 66 97 / 8%);
116 + --shadow-m: 0px 2px 14px 0px rgb(70 66 97 / 5%), 0px 2px 8px 0px rgb(70 66 97 / 5%);
117 + --shadow-l: 0px 0px 48px 0px rgb(70 66 97 / 5%), 0px 6px 16px 0px rgb(70 66 97 / 5%);
118 + --shadow-xl: 0px -26px 30px 0px rgb(70 66 97 / 1%), 0px 26px 11px 0px rgb(70 66 97 / 1%), 0px -15px 40px 0px rgb(70 66 97 / 5%), 0px 15px 9px 0px rgb(70 66 97 / 5%), 0px -7px 24px 0px rgb(70 66 97 / 5%), 0px 7px 7px 0px rgb(70 66 97 / 9%), 0px -2px 4px 0px rgb(70 66 97 / 10%), 0px 2px 4px 0px rgb(70 66 97 / 10%);
119 + }

rose pine moon.css

@@ -9,7 +9,7 @@
9 9 --color-surface-alt: #393552;
10 10 --color-surface-inverted: #b7b5c2;
11 11 --color-content-primary: #e0def4;
12 - --color-content-secondary: #a09add;
12 + --color-content-secondary: #ea9a97;
13 13 --color-content-tertiary: #908caa;
14 14 --color-content-disabled: #6e6a86;
15 15 --color-content-light: #b1adca;
@@ -24,10 +24,10 @@
24 24 --button-primary-surface: #3e8fb0;
25 25 --button-primary-surface-hover: #6eb1cc;
26 26 --button-primary-surface-pressed: #337692;
27 - --button-primary-surface-disabled: #1f4859;
27 + --button-primary-surface-disabled: #485b63;
28 28 --button-primary-content: #000000;
29 - --button-primary-content-pressed: #ffffff;
30 - --button-primary-content-disabled: #247ca1;
29 + --button-primary-content-pressed: #e0def4;
30 + --button-primary-content-disabled: #9594a1;
31 31 --button-surface: transparent;
32 32 --button-surface-hover: #e0def4;
33 33 --button-surface-pressed: #1f1d2f;
@@ -60,15 +60,15 @@
60 60 --button-content-pressed-alt: #cac7db;
61 61 --button-content-disabled-alt: #8b8b8b;
62 62 --color-surface-error: #eb6f92;
63 - --color-content-error: #e0def4;
63 + --color-content-error: #f5b0c4;
64 64 --color-border-error: #fe625d;
65 65 --color-surface-success: #3e8fb0;
66 - --color-content-success: #e0def4;
66 + --color-content-success: #84bbd1;
67 67 --color-border-success: #057b40;
68 68 --color-surface-idle: #9ccfd8;
69 - --color-content-idle: #232136;
69 + --color-content-idle: #dff4f7;
70 70 --color-surface-warning: #f6c177;
71 - --color-content-warning: #232136;
71 + --color-content-warning: #ffe8c7;
72 72 --button-error-primary-surface: #e73d36;
73 73 --button-error-primary-surface-hover: #ef7f7a;
74 74 --button-error-primary-surface-pressed: #da221a;

veryroundbird's Avatar veryroundbird revised this gist 1 month ago. Go to revision

1 file changed, 119 insertions

rose pine moon.css (file created)

@@ -0,0 +1,119 @@
1 + /* Ellipsus Theme | Schema: 1 */
2 + :root {
3 + --color-surface-main: #232136;
4 + --color-surface-writing: #2a273f;
5 + --color-surface-primary: #393552;
6 + --color-surface-neutral: #2a273f;
7 + --color-surface-light: #2a273f;
8 + --color-surface-dim: #191726;
9 + --color-surface-alt: #393552;
10 + --color-surface-inverted: #b7b5c2;
11 + --color-content-primary: #e0def4;
12 + --color-content-secondary: #a09add;
13 + --color-content-tertiary: #908caa;
14 + --color-content-disabled: #6e6a86;
15 + --color-content-light: #b1adca;
16 + --color-content-light-2: #807aa9;
17 + --color-content-dark: #232136;
18 + --color-content-inverted: #000000;
19 + --color-border-primary: #56526e;
20 + --color-border-secondary: #44415a;
21 + --color-border-tertiary: #2a283e;
22 + --color-border-inverted: #e0def4;
23 + --color-border-disabled: #393552;
24 + --button-primary-surface: #3e8fb0;
25 + --button-primary-surface-hover: #6eb1cc;
26 + --button-primary-surface-pressed: #337692;
27 + --button-primary-surface-disabled: #1f4859;
28 + --button-primary-content: #000000;
29 + --button-primary-content-pressed: #ffffff;
30 + --button-primary-content-disabled: #247ca1;
31 + --button-surface: transparent;
32 + --button-surface-hover: #e0def4;
33 + --button-surface-pressed: #1f1d2f;
34 + --button-surface-disabled: transparent;
35 + --button-border: #908caa;
36 + --button-border-hover: #e0def4;
37 + --button-border-pressed: #e0def4;
38 + --button-border-disabled: #6e6a86;
39 + --button-content: #908caa;
40 + --button-content-hover: #e0def4;
41 + --button-content-pressed: #e0def4;
42 + --button-content-disabled: #6e6a86;
43 + --button-primary-alt-surface: #f6c177;
44 + --button-primary-alt-surface-hover: #6eb1cc;
45 + --button-primary-alt-surface-pressed: #6e7b80;
46 + --button-primary-alt-surface-disabled: #232133;
47 + --button-primary-alt-content: #232136;
48 + --button-primary-alt-content-pressed: #262626;
49 + --button-primary-alt-content-disabled: #222222;
50 + --button-surface-alt: transparent;
51 + --button-surface-hover-alt: #4f4971;
52 + --button-surface-pressed-alt: #2e2b43;
53 + --button-surface-disabled-alt: transparent;
54 + --button-border-alt: #888888;
55 + --button-border-hover-alt: #bbbbbb;
56 + --button-border-pressed-alt: #888888;
57 + --button-border-disabled-alt: #666666;
58 + --button-content-alt: #cac7db;
59 + --button-content-hover-alt: #ffffff;
60 + --button-content-pressed-alt: #cac7db;
61 + --button-content-disabled-alt: #8b8b8b;
62 + --color-surface-error: #eb6f92;
63 + --color-content-error: #e0def4;
64 + --color-border-error: #fe625d;
65 + --color-surface-success: #3e8fb0;
66 + --color-content-success: #e0def4;
67 + --color-border-success: #057b40;
68 + --color-surface-idle: #9ccfd8;
69 + --color-content-idle: #232136;
70 + --color-surface-warning: #f6c177;
71 + --color-content-warning: #232136;
72 + --button-error-primary-surface: #e73d36;
73 + --button-error-primary-surface-hover: #ef7f7a;
74 + --button-error-primary-surface-pressed: #da221a;
75 + --button-error-surface: transparent;
76 + --button-error-surface-hover: #4a2221;
77 + --button-error-surface-pressed: #622422;
78 + --button-error-border: #e73d36;
79 + --button-error-border-hover: #ef7f7a;
80 + --button-error-border-pressed: #da221a;
81 + --button-error-content: #e73d36;
82 + --button-error-content-hover: #ef7f7a;
83 + --button-error-content-pressed: #da221a;
84 + --color-system-highlight-selection: #56526e;
85 + --color-system-highlight-comment-idle: #ba9d73;
86 + --color-system-highlight-comment-active: #f6c177;
87 + --color-system-highlight-comment-resolved: #eb6f92;
88 + --color-highlighter-purple: #c4a7e7;
89 + --color-highlighter-blue: #3e8fb0;
90 + --color-highlighter-cyan: #9ccfd8;
91 + --color-highlighter-green: #2d6a5e;
92 + --color-highlighter-yellow: #f6c177;
93 + --color-highlighter-orange: #b02336;
94 + --color-highlighter-coral: #ea9a97;
95 + --color-highlighter-pink: #eb6f92;
96 + --color-highlighter-grey: #56526e;
97 + --color-brand-blue: #6ab8ff;
98 + --color-brand-blue-inverted: #2173be;
99 + --color-brand-blue-alt: #6ab8ff;
100 + --color-brand-orange: #ffad5c;
101 + --color-brand-orange-inverted: #f09236;
102 + --color-brand-purple: #dc78ff;
103 + --color-brand-purple-inverted: #c455eb;
104 + --color-brand-coral: #fe6862;
105 + --color-brand-coral-inverted: #eb5b55;
106 + --color-brand-green: #56c87c;
107 + --color-brand-green-inverted: #529a6a;
108 + --color-content-link: #ea9a97;
109 + --color-graphics-1: #3e8fb0;
110 + --color-graphics-2: #5eb0d1;
111 + --color-graphics-3: #7cc2de;
112 + --color-graphics-4: #8dcfeb;
113 + --shadow-color: #6e6a86;
114 + --shadow-xs: 0px 0px 12px 0px rgb(110 106 134 / 40%);
115 + --shadow-s: 0px 0px 16px 0px rgb(110 106 134 / 40%);
116 + --shadow-m: 0px 0px 16px 0px rgb(110 106 134 / 40%);
117 + --shadow-l: 0px 0px 24px 0px rgb(110 106 134 / 40%);
118 + --shadow-xl: 0px 0px 32px 0px rgb(110 106 134 / 64%);
119 + }
Newer Older

Powered by Opengist ⋅ Load: 11ms⋅

English
⋅ softerror