[cherry-studio主题分享]双色主题：歌蕾蒂娅-返航

[404nyaFound]

分享我写的主题
[歌蕾蒂娅-返航]
(参考了配色)

拥有特殊的阴影和好看的圆角边框！顺便把输入框对齐了！

复制代码到css区域即可~
感谢LostMyHead提供的暗黑主题代码！
2025/2/16 修复暗黑主题气泡模式下文字颜色异常

/*** 歌蕾蒂娅-返航 ***/
:root {
  --chat-background-white: #fff;
  --color-border: rgba(120,120,120,0.08) !important;
}

.message-content-container {
  background: var(--chat-background-white) !important;
  box-shadow: 0 4px 16px -8px rgba(0,0,0,0.04) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 18px !important;
  margin: 8px 0 !important;
  padding: 10px 10px 0 10px !important;
  transition: transform 0.22s cubic-bezier(0.34,1.56,0.64,1) !important;
}

.message-user .message-content-container {
  background: #fbfcfc !important;
  box-shadow: 0 8px 32px -12px rgba(0,0,0,0.03) !important;
}

#inputbar {
  margin: -15px 10px 15px 0px;
  background: rgba(255,255,255,0.96) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 20px !important;
  box-shadow: 0 8px 32px -12px rgba(0,0,0,0.03) !important;
  backdrop-filter: blur(8px) !important;
}

* {
  font-family: 'MiSans Normal', system-ui !important;
  line-height: 1.7 !important;
  letter-spacing: 0.018em !important;
}

body[theme-mode='light'] {
  --color-primary: #df3649;
  --color-primary-soft: #b5242b;
  --color-primary-mute: #6b171b;
}

body[theme-mode='dark'] {
  --color-primary: #df3649;
  --color-primary-soft: #b5242b;
  --color-primary-mute: #6b171b;
  --color-border: rgba(255,255,255,0.1);
  --chat-background-white: #212225;
  --chat-text-user: #EDEEF0;
  --color-text: #EDEEF0;
}

body[theme-mode='dark'] .message-content-container {
  background: var(--chat-background-white) !important;
  box-shadow: 0 4px 16px -8px rgba(0,0,0,0.4) !important;
  border: 1px solid var(--color-border) !important;
}

body[theme-mode='dark'] .message-user .message-content-container {
  background: #2a2a2a !important;
  box-shadow: 0 8px 32px -12px rgba(0,0,0,0.3) !important;
  border: 1px solid var(--color-border) !important;
}

body[theme-mode='dark'] #inputbar {
  background: rgba(34,34,34,0.96) !important;
  border: 1px solid var(--color-border) !important;
  box-shadow: 0 8px 32px -12px rgba(0,0,0,0.3) !important;
  backdrop-filter: blur(8px) !important;
}

预览图~

补充
MiSans字体链接： MiSans

[Twilight9 (Twilight)]

针不戳~

[qinanmail (中气爱)]

佬，暗黑模式下的白框太突兀啦，怎么才能改改呢

[EDWINCHENC (CHEN)]

佬友可可爱爱。感谢分享。

[404nyaFound]

答案是没有做暗黑模式，可以试试在对应部分加一个[theme-mode=‘light’]？你可以把可以正常显示的代码回复出来哦

[qinanmail (中气爱)]

好滴佬，我试试

[Miomiomm (大喵小猫)]

佬友能否搞个仿claude web端风格的，就感觉看起来很舒服，我自己做的没那味儿

[404nyaFound]

啊，没用过claude……试试用取色器修改下代码的颜色即可？期待你的主题~

[Miomiomm (大喵小猫)]

好吧，我仿不出来，只能做到这样

[LostMyHead (Tralalero Tralala)]

用o3mini-high改了一下

总结

:root {
  --chat-background-white: #fff;
  --color-border: rgba(120,120,120,0.08) !important;
}

.message-content-container {
  background: var(--chat-background-white) !important;
  box-shadow: 0 4px 16px -8px rgba(0,0,0,0.04) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 18px !important;
  margin: 8px 0 !important;
  padding: 10px 10px 0 10px !important;
  transition: transform 0.22s cubic-bezier(0.34,1.56,0.64,1) !important;
}

.message-user .message-content-container {
  background: #fbfcfc !important;
  box-shadow: 0 8px 32px -12px rgba(0,0,0,0.03) !important;
}

#inputbar {
  margin: -15px 10px 15px 0px;
  background: rgba(255,255,255,0.96) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 20px !important;
  box-shadow: 0 8px 32px -12px rgba(0,0,0,0.03) !important;
  backdrop-filter: blur(8px) !important;
}

* {
  font-family: 'MiSans Normal', system-ui !important;
  line-height: 1.7 !important;
  letter-spacing: 0.018em !important;
}

body[theme-mode='light'] {
  --color-primary: #df3649;
  --color-primary-soft: #b5242b;
  --color-primary-mute: #6b171b;
}

body[theme-mode='dark'] {
  --color-primary: #df3649;
  --color-primary-soft: #b5242b;
  --color-primary-mute: #6b171b;
  --color-border: rgba(255,255,255,0.1);
  --chat-background-white: #222;
}

body[theme-mode='dark'] .message-content-container {
  background: var(--chat-background-white) !important;
  box-shadow: 0 4px 16px -8px rgba(0,0,0,0.4) !important;
  border: 1px solid var(--color-border) !important;
}

body[theme-mode='dark'] .message-user .message-content-container {
  background: #2a2a2a !important;
  box-shadow: 0 8px 32px -12px rgba(0,0,0,0.3) !important;
  border: 1px solid var(--color-border) !important;
}

body[theme-mode='dark'] #inputbar {
  background: rgba(34,34,34,0.96) !important;
  border: 1px solid var(--color-border) !important;
  box-shadow: 0 8px 32px -12px rgba(0,0,0,0.3) !important;
  backdrop-filter: blur(8px) !important;
}

[qinanmail (中气爱)]

感谢佬，爱你！

[404nyaFound]

好哦~请问可以加到代码里面吗？

[LostMyHead (Tralalero Tralala)]

可以的

[jiangai (Gemini)]

感谢大佬分享

[camellia]

这样的需要吗

[Miomiomm (大喵小猫)]

要的，cherry中thinking的背景和大背景颜色不知道怎么调才能用更好的对比效果，佬有什么好的建议么

[404nyaFound]

这个我能修，我改改

[2512132839 (黑猫警长)]

求一个佬

[tigerK (五竹)]

针不戳！主题不错，提示词更不错

[iouvps (写轮眼卡卡西)]

不错不错味道好极了