精彩热议 / 热议详情

博客配色多彩化

来自：飞絮落叶雪 2026-10-26 17:01 105 条评论

最近一直在折腾博客主题，一些小细节弄了一遍又一遍，挺有成就感，受沉沦博客喜新厌旧之网站配色的启发，也给我的博客配备了八套多彩配色。每套都~精心雕琢抄袭自广大博主，加上 Ai 的优化，算了成型了，大家可以选择自己喜欢的配色来逛我的博客。手动选过亮/暗 → 记住，刷新、PJAX 都保持。手动选过配色 → 记住，刷新保持。选“自动”或从未选过 → 跟随系统；系统切换深/浅时页面实时跟随（未手动选择的情况下）。首屏由 head 脚本一次性设好 data-theme 和 data-palette（默认 pearl），无闪烁。footer 只负责交互和按钮高亮，不再二次覆盖主题属性。以下图片是让 Deep…

这里只收录了这篇的「讨论信息」，没有正文。想看原文，点上面的标题去作者网站 （新窗口打开）。

全部评论 共 105 条 · 第 3/6 页

  • 小赵 2026-10-29 01:55

    感觉这些配色都还不错

  • Mr.He 回复 @小赵 2026-10-29 02:11

    我也觉得很和谐。

  • 花非花 2026-10-28 23:16

    我用AI写网站也喜欢多加几套配色，可惜的是出来的效果没有多少我自己满意的

  • Mr.He 回复 @花非花 2026-10-28 23:17

    把我的配色搬过去试试

  • 雅余 2026-10-28 07:33

    这颜色选的不错，我都想偷。

  • Mr.He 回复 @雅余 2026-10-28 07:35

    哈哈，设计大佬能看上，很荣幸

  • 老张博客 2026-10-28 05:39

    现在是纯自己的主题了？

  • Mr.He 回复 @老张博客 2026-10-28 05:42

    框架不是自己的，我就依自己的喜好增删一些个性化的小玩意。

  • 网友小宋 2026-10-27 23:06

    感觉黄色几个系列舒服一些，但是过于太淡了

  • Mr.He 回复 @网友小宋 2026-10-28 00:28

    淡妆浓抹总相宜ヾ(≧∇≦*)ゝ

  • 倦意 2026-10-27 18:40

    暖棕金不错

  • Mr.He 回复 @倦意 2026-10-27 18:57

    比较适合阅读

  • 東风 2026-10-27 17:19

    你的换色面板出现在左上方有bug 解决办法：删除css中的#qiwi-palette-panel中的top和left的!important，js：// 面板在隐藏状态下仍占布局，可直接量出真实高度，避免用写死的 400pxconst rect = trigger.getBoundingClientRect();const panelWidth = 220;const gap = 10;// 面板在隐藏状态下仍占布局，可直接量出真实高度，避免用写死的 400pxconst panelHeight = panel.offsetHeight || 360;// 水平方向：以触发图标为中心const left = rect.left + (rect.width / 2) - (panelWidth / 2);if (left < 10) left = 10;if (left + panelWidth > window.innerWidth - 10) {left = window.innerWidth - panelWidth - 10;}

  • 東风 回复 @東风 2026-10-27 17:24

    // 垂直方向：优先出现在图标上方；上方放不下才落到图标下方const top = rect.top - panelHeight - gap; // ← 默认在图标【上方】if (top < 10) {top = rect.bottom + gap;if (top + panelHeight > window.innerHeight - 10) {top = window.innerHeight - panelHeight - 10;if (top < 10) top = 10;}}panel.style.left = left + 'px';panel.style.top = top + 'px';panel.classList.add('is-open');

  • 東风 回复 @東风 2026-10-27 17:26

    function closePanel() {if (panel.classList.contains('is-open')) panel.classList.remove('is-open');}// 点击页面任意处收起document.addEventListener('click', closePanel);// 面板用的是 fixed 定位 + 视口坐标，一旦滚动或改变窗口大小坐标就失效，直接收起window.addEventListener('scroll', closePanel, { passive: true });window.addEventListener('resize', closePanel);

  • Mr.He 回复 @東风 2026-10-27 18:56

    太牛了，已修改完成。我封你为博客届大善人。

  • Feng 2026-10-27 04:33

    完了完了，又多了一个爱折腾的家伙了

  • Mr.He 回复 @Feng 2026-10-27 04:38

    和你比还差一点意思，我只能在原来的基础上修改，你可以直接造。

  • Feng 回复 @Feng 2026-10-27 23:39

    谦虚了，都是驱赶AI赶路的人，不分彼此

  • Feng 回复 @Feng 2026-11-02 05:35

    这点配色是越看越喜欢了