分享一下本站 Catppuccin Mocha 主题配色

14 条回复
142 次浏览

这个是 Zed 编辑器上比较火的主题,有用户觉得不错可以内置到 2Libra 上。

其实 2Libra 用的 daisyUI 支持几乎全部主要颜色和圆角等的自定义,所以我就按这个主题的一些配色做了适配当前站的处理。

将下面的变量配置保存到 https://2libra.com/user/setting/theme 即可应用,名称可随意或填写 Catppuccin。

复制
@plugin "daisyui/theme" {
  name: "dark";
  default: false;
  prefersdark: true;
  color-scheme: "dark";

  /* Catppuccin Mocha */
  --color-base-100: oklch(0.243 0.030 283.911); /* Base */
  --color-base-200: oklch(0.216 0.025 284.065); /* Mantle */
  --color-base-300: oklch(0.324 0.032 281.978); /* Surface 0 */
  --color-base-content: oklch(0.879 0.043 272.277); /* Text */

  /* Mauve */
  --color-primary: oklch(0.787 0.119 304.769);
  --color-primary-content: oklch(0.183 0.020 284.204);

  /* Pink */
  --color-secondary: oklch(0.870 0.075 336.304);
  --color-secondary-content: oklch(0.183 0.020 284.204);

  /* Blue */
  --color-accent: oklch(0.766 0.111 259.885);
  --color-accent-content: oklch(0.183 0.020 284.204);

  /* Surface 1 */
  --color-neutral: oklch(0.404 0.032 280.152);
  --color-neutral-content: oklch(0.879 0.043 272.277);

  /* Sapphire */
  --color-info: oklch(0.791 0.096 228.653);
  --color-info-content: oklch(0.183 0.020 284.204);

  /* Green */
  --color-success: oklch(0.858 0.109 142.715);
  --color-success-content: oklch(0.183 0.020 284.204);

  /* Yellow */
  --color-warning: oklch(0.919 0.070 86.528);
  --color-warning-content: oklch(0.183 0.020 284.204);

  /* Red */
  --color-error: oklch(0.756 0.130 2.764);
  --color-error-content: oklch(0.183 0.020 284.204);

  /* DaisyUI shape */
  --radius-selector: 0.5rem;
  --radius-field: 0.5rem;
  --radius-box: 0.75rem;

  --size-selector: 0.25rem;
  --size-field: 0.25rem;

  --border: 1px;

  --depth: 1;
  --noise: 0;
}

你可以继续对这个主题的颜色做更多的自定义。

❤️1
100
都听我说!

@plugin "daisyui/theme" {
name: "light";
default: true;
prefersdark: false;
color-scheme: "light";

--color-base-100: oklch(1 0 0);
--color-base-200: oklch(0.970 0 0);
--color-base-300: oklch(0.870 0 0);
--color-base-content: oklch(0.269 0 0);

--color-primary: oklch(0.511 0.086 186);
--color-primary-content: oklch(0.99 0 0);

--color-secondary: oklch(0.400 0 0);
--color-secondary-content: oklch(0.99 0 0);

--color-accent: oklch(0.600 0.104 185);
--color-accent-content: oklch(0.99 0 0);

--color-neutral: oklch(0.932 0.028 186);
--color-neutral-content: oklch(0.320 0.055 186);

--color-info: oklch(0.520 0.094 205);
--color-info-content: oklch(0.99 0 0);

--color-success: oklch(0.620 0.140 150);
--color-success-content: oklch(0.99 0.01 150);

--color-warning: oklch(0.780 0.140 70);
--color-warning-content: oklch(0.30 0.06 60);

--color-error: oklch(0.620 0.200 28);
--color-error-content: oklch(0.99 0.01 28);

--radius-selector: 0.65rem;
--radius-field: 0.65rem;
--radius-box: 1rem;

--size-selector: 0.25rem;
--size-field: 0.26rem;

--border: 1px;
--depth: 0;
--noise: 0;
}

都听我说!

有喜欢阳光系的吗?

复制
@plugin "daisyui/theme" {
  name: "sunshine";
  default: false;
  prefersdark: false;
  color-scheme: "light";
  --color-base-100: oklch(0.96 0.04 85);
  --color-base-200: oklch(0.92 0.05 80);
  --color-base-300: oklch(0.88 0.06 75);
  --color-base-content: oklch(0.25 0.03 45);
  --color-primary: oklch(0.78 0.18 85);
  --color-primary-content: oklch(0.15 0.02 45);
  --color-secondary: oklch(0.72 0.16 55);
  --color-secondary-content: oklch(0.15 0.02 45);
  --color-accent: oklch(0.70 0.12 235);
  --color-accent-content: oklch(0.15 0.02 45);
  --color-neutral: oklch(0.75 0.04 70);
  --color-neutral-content: oklch(0.20 0.02 45);
  --color-info: oklch(0.72 0.12 235);
  --color-info-content: oklch(0.15 0.02 45);
  --color-success: oklch(0.75 0.14 135);
  --color-success-content: oklch(0.15 0.02 45);
  --color-warning: oklch(0.85 0.16 75);
  --color-warning-content: oklch(0.15 0.02 45);
  --color-error: oklch(0.68 0.18 25);
  --color-error-content: oklch(0.15 0.02 45);
  --radius-selector: 0.8rem;
  --radius-field: 0.6rem;
  --radius-box: 1rem;
  --size-selector: 0.3rem;
  --size-field: 0.3rem;
  --border: 1px;
  --depth: 1.2;
  --noise: 0;
}
展开 1 条评论

发表一个评论

R保持