主题配色·字体搭配·免费版

SKILL前端设计
前端设计 未标注权限 许可证不明确
安装这个技能

原创免费技能(不依赖任何专有实现)。内置 10 套专业主题(每套含协调色板与标题/正文字体配对),可应用到演示文稿、文档或网页产物;支持用户给定意象时现场生成定制主题。提供主题展示与应用纪律,确保跨产物视觉一致。免费版,不引用任何付费端点。

一句话选型结论

按资料字段整理

主题配色·字体搭配·免费版是前端设计类的 Agent Skill,安装方式未标注,权限级别未标注,许可证不明确,有可直接复制的安装命令。技能本质是给模型读的说明书,效果取决于模型与客户端;装完先用一个小任务验证,再放进正式流程。

分类前端设计 安装方式未标注 权限级别未标注权限 许可证许可证不明确
累计安装 未标注 本周 未标注
GitHub 星标 未标注 仓库 未标注
下载量 未标注 技能市场下载数
权限级别 未标注权限 安装前请确认风险范围
许可证 许可证不明确 未说明

安装

未标注
在支持 Skills 的客户端里执行,装完问一句「你有哪些技能」验证
skillhub install user_d4933a3c/zhuti-gongchang-free
  1. 1
    确认客户端支持

    确认你的客户端支持 Skills(Claude、Codex、Cursor 等),并升级到较新的版本。

  2. 2
    拿到技能文件

    执行上面的命令安装;也可以把仓库里的 SKILL.md 手动放进客户端的 skills 目录。

  3. 3
    刷新技能列表

    重新打开客户端,或刷新技能列表,让新放进来的技能被加载。

  4. 4
    验证是否生效

    问一句「你有哪些技能」,确认列表里出现它,再拿一个小任务试跑。

技能档案

前端设计
字段来自技能仓库与公开索引,中文说明由本站标注
作者 / 维护方user_d4933a3c仓库 未标注 · 版本 未标注
宿主客户端未标注技能可被这些客户端加载
安装方式未标注安装包 community
权限级别未标注权限安装前请确认风险范围
许可证未说明许可证不明确,商用前请自行确认条款
仓库可用性available技能仓库当前是否可访问
最近核验未标注上游最后核验时间 · 数据更新 1791681136
正文体量7.4 KBSKILL.md 原文大小,越大说明说明书写得越细

典型使用场景

3 类
按分类整理的常见用法,具体以 SKILL.md 为准
出页面与组件

按描述生成页面结构和组件草稿。

调整样式与布局

改间距、配色与响应式布局。

生成设计说明

把设计稿整理成开发能接的说明。

选择建议

装之前先看这几条
按条目字段给出的判断,不替你决定用不用

值得选的地方

  • 有可直接复制的安装命令,不用自己翻文档找入口。

先想清楚的地方

  • 没有标注权限级别,实际能做什么要装好后确认。
  • 许可证不明确,商用或二次分发前先到仓库确认条款。
  • 没有做站内核验,内容以作者仓库为准。
  • 技能只是说明书,实际效果取决于模型与客户端,装完先用小任务试一遍。

更适合

  • 需要在前端设计场景里给模型补一套做法的人。
  • 愿意先读一遍 SKILL.md、确认它会让模型做什么的人。

不太适合

  • 对许可证要求很严、必须明确可商用的人。
  • 只想装完就自动变强、不打算看说明书的人。

同类对比

6 个同类
同分类里挑最接近的几条,字段以各自详情页为准
技能权限级别安装方式累计安装宿主客户端安装命令
主题配色·字体搭配·免费版当前 未标注权限 未标注 未标注 未标注 有
前端设计 只读 GitHub 仓库 882.3 万 Codex、Claude、Cursor 有
Vercel 组合模式 联网访问 GitHub 仓库 385.9 万 Codex、Claude、Cursor 有
Vercel React native skills 前端 只读 GitHub 仓库 246.9 万 Codex、Claude、Cursor 有
adapt 搜索 浏览器控制 GitHub 仓库 202.7 万 Codex、Claude、Cursor 有
使用我的浏览器 浏览器控制 GitHub 仓库 184.8 万 Codex、Claude、Cursor 有

SKILL.md 全文

7.4 KB
模型实际读到的说明书原文,来自技能仓库

主题工厂·免费版

原创免费技能。内置 10 套专业主题(色板 + 字体配对),可应用到幻灯片/文档/网页;也支持按需生成定制主题。所有指令均为本技能原创。

红线(不可违反)

  1. 不套 AI 默认风:应用主题时按主题本身逻辑走,不退化成「奶油底+酸绿强调+卡片套件」
  2. 不引导付费:本技能为免费版,不引用任何付费端点
  3. 一致性:同一产物全程使用选定主题,不混用
  4. 可读性:主题配色须保证正文对比度达标
  5. 用户确认:应用前必须让用户选定主题,不擅自决定

何时使用

  • 用户要给产物换/定主题(PPT/文档/网页)
  • 用户要现成配色方案灵感
  • 用户要定制主题(给定意象/品牌色)

反触发:从零做视觉设计 → 转「前端设计·免费版」;品牌资产系统化 → 转「品牌视觉规范·免费版」。

职责边界

  • 本技能负责:主题展示、选择引导、跨产物一致应用、定制主题生成
  • 本技能不负责:logo/标志设计、未授权品牌色的原创拟定

5 分钟上手(复制即出成品)

主题最容易翻车的不是"没色号",而是色号对比度不达标 + 手动逐处改色。下面这段一次解决:
对内置主题做 WCAG 对比度体检,然后把选定的主题直接套进一个真实 PPTX(含满版封面),
末尾自检颜色是否真的写进去了。

# RUN: fixture=empty
from pptx import Presentation
from pptx.util import Emu, Pt
from pptx.dml.color import RGBColor
from pptx.enum.shapes import MSO_SHAPE

THEMES = {"深海行政": "1E2761", "珊瑚能量": "F96167", "暖金时光": "B5651D"}
INK, PAPER = "212121", "FFFFFF"
PICK = "深海行政"


def lum(hex6):
    def ch(c):
        c /= 255
        return c / 12.92 if c <= 0.03928 else ((c + 0.055) / 1.055) ** 2.4
    r, g, b = (ch(int(hex6[i:i + 2], 16)) for i in (0, 2, 4))
    return 0.2126 * r + 0.7152 * g + 0.0722 * b


def contrast(a, b):
    la, lb = lum(a), lum(b)
    return (max(la, lb) + 0.05) / (min(la, lb) + 0.05)


# ---- 体检:主色对白底,判断能不能直接写正文 ----
for name, main in THEMES.items():
    c = contrast(main, PAPER)
    print(f"{name} 主色对白底 {c:.2f} → {'可直接做正文色' if c >= 4.5 else '只做标题/色块,正文用墨色'}")

MAIN = THEMES[PICK]
TITLE_FG = PAPER if contrast(MAIN, PAPER) >= contrast(MAIN, INK) else INK


def C(h):
    return RGBColor.from_string(h)


prs = Presentation()
prs.slide_width, prs.slide_height = Emu(12192000), Emu(6858000)
s = prs.slides.add_slide(prs.slide_layouts[6])
bg = s.shapes.add_shape(MSO_SHAPE.RECTANGLE, 0, 0, prs.slide_width, prs.slide_height)
bg.fill.solid()
bg.fill.fore_color.rgb = C(MAIN)
bg.line.fill.background()
bg.shadow.inherit = False
tb = s.shapes.add_textbox(Emu(914400), Emu(2514600), Emu(10363200), Emu(1371600))
p = tb.text_frame.paragraphs[0]
r = p.add_run()
r.text = f"{PICK} · 主题已应用"
r.font.size = Pt(44)
r.font.bold = True
r.font.color.rgb = C(TITLE_FG)
prs.save("themed_mini.pptx")

# ---- 自检:重新打开,核对满版底色与标题色 ----
chk = Presentation("themed_mini.pptx")
got_bg = str(chk.slides[0].shapes[0].fill.fore_color.rgb)
print(f"PPTX 底色={got_bg}({'OK' if got_bg == MAIN else 'FAIL'}),标题色={TITLE_FG}")

这段脚本里最容易踩的三个坑

  1. 对比度体检不是走形式:珊瑚能量主色 #F96167 对白底只有 3.03,直接做正文色就是灾难;
    脚本会明确告诉你哪套主题的正文要退回墨色
  2. 形状默认带阴影:shadow.inherit = False 不写,满版底色会带一条脏脏的阴影边
  3. 文字色别无脑用白:TITLE_FG 是按对比度自动选的白/墨,亮色主色配白字会看不清

完整落地库(PPT 三页 / Word 样式绑定 / Excel 表头报表)见 references/apply.md。

主流程

第 1 步:展示主题并收集选择

向用户展示 references/themes.md 的 10 套主题(色板+字体);若用户已给偏好(如「科技感」),先按偏好预筛 2-3 套推荐再确认,不必全量铺开;或询问定制意象。

质检闸 1:未确认主题前不应用。

第 2 步:应用主题

  • 幻灯片/PPT、文档(样式级绑定)、Excel(表头报表):直接跑 references/apply.md 的对应脚本,出真实成品
  • 网页:用 references/themes.md 末尾导出的 theme.css,切主题只改 data-theme 属性
  • 不用脚本时:逐处写入色值/字体,写完逐条核对与主题表一致

质检闸 2:色值/字体与所选主题逐条一致,全程不混用。

第 3 步:定制主题(如需)

按用户意象,从 references/themes.md 的方法生成新主题:命名 + 色板(主/辅/锐)+ 字体配对 + 适用场景,展示确认后再应用。

质检闸 3:定制主题有命名、有具体色值、有字体,可被执行。

第 4 步:自检清单

  • [ ] 主题经用户确认
  • [ ] 产物色值/字体与主题一致
  • [ ] 未混用多主题
  • [ ] 正文对比度达标
  • [ ] 定制主题含可执行数值(如需)
  • [ ] 无付费引导话术残留

失败降级

  • 指定字体缺失 → 退回安全字体并提示
  • 用户意象模糊 → 先给 2-3 套候选再细化
  • 产物类型不支持主题 → 说明限制,给最接近的替代

依赖

无强制依赖;跨产物生成时调用对应开源技能/库(python-pptx / python-docx / HTML+CSS)。

相关技能推荐

  • hanshe-yishu-free — AI 海报设计与视觉艺术创作:封面图、活动海报、宣传图、艺术 PNG/PDF。原创构图 + 极简文字排版,专家级设计质感,开源免费
  • brand-style-free — 品牌视觉规范(VI)自动生成:主辅色、中英文字体、标志使用规范。一键应用到文档 / PPT / 海报 / 网页,统一企业视觉,开源免费
  • cad-free — CAD 建模 / Mechanical Design:开源参数化建模与工程图 — 零件建模、标准件库、装配体、尺寸驱动、STEP/STL/D
  • cae-free — 开源有限元分析流程:前处理与网格划分、材料与边界条件、静力/模态/热分析求解、结果判读与网格收敛验证、报告与免责清单

致谢

本技能为原创,与任何厂商的专有主题技能无隶属、无复制关系。

常见问题

5 问
答案由本站依据条目字段整理
主题配色·字体搭配·免费版怎么安装?

在支持 Skills 的客户端里执行:skillhub install user_d4933a3c/zhuti-gongchang-free。安装方式为未标注。装完刷新技能列表或重开客户端。

主题配色·字体搭配·免费版支持哪些客户端?

资料没有标注宿主客户端,但只要客户端支持 Skills(Claude、Codex、Cursor 等),一般都能加载。

主题配色·字体搭配·免费版权限高吗,安全吗?

权限级别为未标注权限。安装前先看它会读取或写入哪些内容。

主题配色·字体搭配·免费版收费吗?

本站不代收费用,也没有标注具体价格。是否收费取决于技能本身和所用的模型或客户端,正式使用前按作者说明确认。

主题配色·字体搭配·免费版用什么许可证?

许可证标注为 未说明(许可证不明确)。商用或二次分发前请到仓库确认条款原文。

热门专题

按场景挑技能
全部专题 →

技能内容以作者仓库为准;分类、权限级别与许可证状态的中文说明为中文整理,最近核验 未标注。