API网关后端负载均衡【免费下载链接】gpt-loadSelf-hosted AI gateway for multi-channel, multi-credential setups — API keys and subscription accounts, scheduling, failover, request logs and usage. 自托管 AI 网关多渠道多凭据统一接入含密钥与订阅账号、调度容错、日志与用量。项目地址https://gitcode.com/gh_mirrors/gp/gpt-load点击查看免费下载本篇技术指南以 GPT-Load 前端仓库中的品牌资源文档web/src/frontends/modern/assets/brand/README.md为骨架系统梳理新版「Coral Anchor」品牌资源包的来源映射、配色 token、横版/方形两种形态的 SVG 结构以及 classic 与 modern 两套前端如何复用同一份吉祥物路径并解析 favicon 在 web/index.html 中的静态声明与带版本号的缓存刷新策略。读完本文你可以完整掌握 GPT-Load 品牌资源的组织方式、明暗主题适配原理以及如何在不依赖前端启动逻辑的前提下更新网站图标。一、资源包概览从旧资源到 Coral Anchor 的映射品牌资源目录web/src/frontends/modern/assets/brand/下共包含 7 个文件README.md、logo-light.svg、logo-dark.svg、icon.svg、login-mascot-body.webp、login-mascot-eye.webp、login-mascot-tail.webp以及第三方的octicons.LICENSE。其中前三个 SVG 来自用户确认的 GPT-Load Coral Anchor 资源包保留了原始图形、文字路径和比例只是配色与新版界面保持一致。原文档给出的三份映射关系如下新资源相对仓库根目录原始来源用途web/src/frontends/modern/assets/brand/logo-light.svg原svg/logo-horizontal-color.svg浅色背景使用web/src/frontends/modern/assets/brand/logo-dark.svg原svg/logo-horizontal-dark.svg深色背景使用web/src/frontends/modern/assets/brand/icon.svg原web/icon.svg用于收起侧栏后的窄位置图标此外login-mascot-*.webp三张图被登录页的吉祥物组件引用web/src/frontends/modern/features/auth/LoginMascot.vue通过modern/assets/brand/login-mascot-body.webp等别名导入身体、眼睛和尾巴素材用于登录场景的动画分解。二、配色体系品牌色与主题文字色整个资源包围绕一套固定的品牌色板展开原文档给出的核心数值为品牌橘红#FF4F1F用于图形主体吉祥物轮廓与方形图标的底色中性深灰#1C1C1B浅色背景下的文字wordmark颜色近白色#F5F5F2深色背景下的文字颜色。这三个数值可以在 SVG 源码中逐一得到印证logo-light.svg1200×300中mascot分组路径使用fill#FF4F1Fwordmark分组路径使用fill#1C1C1Bbrand/icon.svg512×512中整块底色为rect fill#FF4F1F吉祥物图形为fill#F5F5F2即「橘红底、近白图形」的方形图标web/public/favicon.svg512×512中吉祥物路径为fill#FF4F1F、透明背景与文档描述完全一致。同时原文档强调「界面配色仍由styles/tokens.css独立维护」——即 SVG 静态资源只负责品牌图形本身界面动态配色统一收敛在设计 token 层。web/src/frontends/modern/styles/tokens.css 中的关键声明印证了这一点--modern-action: #ff4f1f; /* 品牌橘红 */ --modern-coral: var(--modern-action); --modern-text: light-dark(#1c1c1b, #f5f5f2); /* 文字色随明暗主题切换 */可以看到--modern-text使用 CSSlight-dark()函数在同一行内同时定义浅色#1c1c1b与深色#f5f5f2两种取值与 SVG 里两套 wordmark 填色一一对应。token 层通过web/src/frontends/modern/styles/base.css的import ./tokens.css全局生效保证「品牌图形静态定色、界面配色动态走 token」的分层设计。三、横版 Logo 与方形图标4:1 与 1:1 两种形态原文档明确了形态规则横版 Logo 保持 4:1 比例窄位置使用橘红底、近白图形的方形图标。这一规则在 SVG 文件与组件两层都有落地证据静态 SVG 层logo-light.svg的width1200 height300即为严格的 4:1icon.svg的width512 height512为 1:1 方形。组件层web/src/frontends/modern/components/BrandLogo.vue中.modern-brand-mascot设置了aspect-ratio: 4而.is-compact时切换为aspect-ratio: 1并额外绘制rx128的圆角方形底.modern-brand-mascot-tilefill: var(--modern-action)图形本身以--modern-mascot-inverse近白呈现正是「橘红底、近白图形」的实现。icon.svg的图形分组变换translate(51.2 145.7518) scale(0.7474)与BrandLogo.vue中 compact 模式下的变换compact ? translate(51.2 145.7518) scale(0.7474)完全一致横版场景下组件使用translate(56 75.7117) scale(0.5036)与logo-light.svg的 mascot 分组变换也逐字符吻合。这说明 modern 界面的动态 Logo 组件复用了静态 SVG 资源的原始路径与比例只是在组件层叠加了动画与 token 化配色。关于「不依赖字体」的细节logo-light.svg的desc明确写着 All lettering is outlined; no font or image dependencies.即字标全部转为轮廓路径例如 wordmark 分组内的多段M ... C ... Z路径部署时无需携带特定字体保证任何环境渲染一致。四、两套前端的统一吉祥物路径modern 与 classic原文档明确指出这些资源仅由 modern 引用classic 的BrandMark.vue使用相同吉祥物路径。这是理解仓库双前端web/src/frontends/modern与web/src/frontends/classic品牌一致性的关键。web/src/frontends/classic/components/brand/BrandMark.vue的实现与文档描述逐条对应viewBox0 0 512 512保持「原有方形尺寸」图形分组transformtranslate(20.48 129.2146) scale(0.85951)与web/public/favicon.svg的吉祥物变换完全一致——这就是「相同吉祥物路径」的直接证据整个 SVG 只有吉祥物轮廓、无文字、透明背景符合「无文字、透明背景」的要求根元素fillcurrentColor样式层color: var(--color-action)从而「通过currentColor沿用旧版的--color-action适配浅色和深色主题」——主题变化时只需改变--color-action的值图标颜色自动跟随。相比之下modern 前端使用 BrandLogo.vue 作为品牌组件通过use :href# silhouette引用同一段吉祥物路径并用clipPath将尾巴与身体分离以支持摇尾动画组件还内置了sniff嗅探、nudge轻推、fold/unfold收起/展开、theme明暗切换等交互动画并遵守prefers-reduced-motion可访问性偏好。该组件在 SidebarContent.vue 中通过BrandLogo :compactcollapsed :resolved-themeresolvedTheme使用collapsed状态来自 preferences.ts 中持久化的gpt-load.modern.sidebar-collapsed偏好——收起侧栏时即切换为方形图标形态与「icon.svg 用于收起侧栏」的定位呼应。五、favicon静态声明与缓存版本化网站图标web/public/favicon.svg使用与 classicBrandMark.vue相同的吉祥物路径translate(20.48 129.2146) scale(0.85951)、品牌橘红#FF4F1F填色和透明背景等比放大以适应浏览器标签页的小尺寸。其特殊性在于由 HTML 静态声明而非前端启动后动态替换!-- web/index.html -- link relicon href/favicon.svg?vcoral-anchor-orange typeimage/svgxml /从源码结构看该声明位于web/index.html的head中与script src/theme-bootstrap.js等启动脚本平级因此在任何前端 JS 执行前浏览器即可取到图标从而保证新旧界面和登录页共用且不依赖前端启动后替换。meta namecolor-scheme contentlight dark同时为图标在不同系统主题下提供了渲染基准。文档还给出了一条重要的维护规范图标 URL 带素材版本vcoral-anchor-orange更新素材时需同步更新该版本号以刷新浏览器缓存。这是因为浏览器对/favicon.svg这类静态资源会做缓存只有修改查询参数中的版本标识才能强制客户端重新拉取。这是实践中容易遗漏、但直接决定新图标能否及时生效的关键细节。六、GitHubIcon 与 Octicons 许可证web/src/frontends/modern/components/GitHubIcon.vue使用 GitHub 官方 Octicons 中的mark-github-16图标实现要点保留原始 16×16 的viewBox与路径数据未做几何修改根元素fillcurrentColor与BrandMark.vue相同的技巧——颜色由 CSS 的currentColor决定从而自动适配明暗主题附加aria-hiddentrue与focusablefalse在侧栏链接SidebarContent.vue 的 footerLinks 中作为纯装饰图标使用时不干扰屏幕阅读器。第三方素材的合规性也已在仓库内闭环其 MIT 许可证全文存放于本目录的 web/src/frontends/modern/assets/brand/octicons.LICENSE与文档中「保留原始路径、MIT 许可证见本目录的 octicons.LICENSE」的描述一致方便后续追溯授权来源。七、维护要点小结结合原文档与源码整理出维护 GPT-Load 品牌资源时的几条实操要点图形路径是唯一事实源BrandMark.vueclassic、BrandLogo.vuemodern 动态组件与favicon.svg共用同一段吉祥物路径数据translate(20.48 129.2146) scale(0.85951)或translate(56 75.7117) scale(0.5036)修改吉祥物形状时需同步三处或考虑将路径抽为共享常量配色分层静态 SVG 内固定品牌橘红#FF4F1F与文字色界面动态配色一律走tokens.css--modern-action、--modern-text等避免在组件里散落硬编码色值favicon 更新必升版本号修改web/public/favicon.svg后同步更新 web/index.html 中link relicon的v查询参数否则浏览器缓存会导致新旧图标混用第三方素材保留许可证引入 Octicons 等外部图标时沿用octicons.LICENSE的做法在仓库内留存许可证全文并保留原始路径与currentColor适配机制。这套「静态品牌资源 动态 token 配色 跨前端路径复用 版本化缓存」的体系保证了 GPT-Load 在 modern、classic 与登录页三处入口的品牌呈现一致性也为后续更换品牌视觉提供了清晰的改动边界。赞分享API网关后端负载均衡【免费下载链接】gpt-loadSelf-hosted AI gateway for multi-channel, multi-credential setups — API keys and subscription accounts, scheduling, failover, request logs and usage. 自托管 AI 网关多渠道多凭据统一接入含密钥与订阅账号、调度容错、日志与用量。项目地址https://gitcode.com/gh_mirrors/gp/gpt-load点击查看免费下载相关推荐LaZagne吉祥物设计开源项目品牌形象与社区文化建设LaZagne吉祥物设计开源项目品牌形象与社区文化建设 项目品牌现状分析 LaZagne作为凭证恢复工具目前品牌视觉识别系统存在明显缺口。通过检索项目仓库结网络安全渗透测试Kadalu存储配置完全指南从基础部署到高级优化Kadalu存储配置完全指南从基础部署到高级优化 Kadalu是一款轻量级的Kubernetes/OpenShift/Nomad持久化存储解决方案它在后台使AX 标志体系解析六线鱼吉祥物由来与双色 SVG 资产的源码级实现AX 标志体系解析六线鱼吉祥物由来与双色 SVG 资产的源码级实现 本文以 AX 仓库的官方标志文档 docs/logo.md https://link.gi人工智能AI AgentAgent 框架自主智能体创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
