Agent skill

Color Font Skill

by haojing8312 in haojing8312/WorkClaw

Choose presentation-ready color palettes and font pairings for PPT/design tasks.

Apache-2.0Auto-check passedFrontend & Design

Install Color Font Skill

skills CLI
$ npx skills add haojing8312/WorkClaw --skill color-font-skill -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install haojing8312/WorkClaw color-font-skill --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/haojing8312/WorkClaw.git skills-src && mkdir -p .claude/skills && cp -r skills-src/apps/runtime/src-tauri/builtin-skills/pptx/skills/color-font-skill .claude/skills/color-font-skill && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
color-font-skill
GitHub stars
141
Used in
1 other repo
Token cost
~1.4k tokens
SKILL.md length
483 words
Files
1
Skills in repo
14
Repo updated
First seen
Licence
Apache-2.0

At a glance

Choose presentation-ready color palettes and font pairings for PPT/design tasks.

  • Users ask for visual theme choices
  • SKILL.md covers White 白色系(背景与浅色表面), Gold 金色系(铂金商务强调色), Blue 蓝色系(主操作色) and Gray 灰色系(文字与中性色), plus 2 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
  • Brand-safe palettes

What it does

Color Font Skill is an agent skill from haojing8312/WorkClaw. Choose presentation-ready color palettes and font pairings for PPT/design tasks. Use when users ask for visual theme choices, brand-safe palettes, or font recommendations. Triggers include: 配色, 色板, 字体, color palette, font, PPT配色, 字体搭配.

Its SKILL.md is about 1.4k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Frontend & Design, covering Theming and dark mode, Typography and PowerPoint presentations. The licence is Apache-2.0.

When your agent uses it

  • Users ask for visual theme choices
  • Brand-safe palettes
  • Font recommendations

Example prompts

  • “/color-font-skill”

What it can do on your machine

Read from SKILL.md and the folder at commit 81ae074. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md.

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Color Font Skill loads about 1.4k tokens when it runs. Until then it costs about 63 tokens; SKILL.md has 483 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~63
When it runs · the whole SKILL.md, loaded when a task matches
~1.4k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from haojing8312/WorkClaw at commit 81ae074, republished under its Apache-2.0 licence (© haojing8312). 483 words, ~1,372 tokens.

Download SKILL.mdSave it as .claude/skills/color-font-skill/SKILL.md (or your agent's skills folder).
name
color-font-skill
description
Choose presentation-ready color palettes and font pairings for PPT/design tasks. Use when users ask for visual theme choices, brand-safe palettes, or font recommendations. Triggers include: 配色, 色板, 字体, color palette, font, PPT配色, 字体搭配.

Color Scheme - PPT 配色方案指南

#名称色值风格适用场景建议
1现代与健康#006d77 #83c5be #edf6f9 #ffddd2 #e29578清新、治愈医疗健康、心理咨询、护肤品、瑜伽Spa深青做标题,浅粉做背景
2商务与权威#2b2d42 #8d99ae #edf2f4 #ef233c #d90429严谨、经典年度汇报、金融分析、企业介绍、政务报告深蓝显专业,亮红强调数据
3自然与户外#606c38 #283618 #fefae0 #dda15e #bc6c25沉稳、大地色户外用品、环境保护、农业项目、历史文化深绿为底,米色为字
4复古与学院#780000 #c1121f #fdf0d5 #003049 #669bbc经典、书卷气学术讲座、历史回顾、博物馆、复古品牌深红与深蓝对比强烈
5柔美与创意#cdb4db #ffc8dd #ffafcc #bde0fe #a2d2ff梦幻、糖果色母婴产品、甜品店、女性时尚、幼儿园文字用深灰或黑色
6波西米亚#ccd5ae #e9edc9 #fefae0 #faedcd #d4a373温柔、低饱和婚礼策划、家居软装、有机食品、慢生活米色背景,绿棕点缀
7活力与科技#8ecae6 #219ebc #023047 #ffb703 #fb8500高能量、运动体育赛事、健身房、创业路演、少儿教育深蓝稳重心,橙色做焦点
8匠心与手作#7f5539 #a68a64 #ede0d4 #656d4a #414833质朴、咖啡调咖啡店、手工艺品、传统文化、烘焙教学适合纸质/皮革质感
9科技与夜景#000814 #001d3d #003566 #ffc300 #ffd60a深邃、高亮科技发布会、星空天文、夜间经济、高端汽车必须用深色模式
10教育与图表#264653 #2a9d8f #e9c46a #f4a261 #e76f51清晰、逻辑强统计报告、教育培训、市场分析、通用商务完美的图表配色
11森林与环保#dad7cd #a3b18a #588157 #3a5a40 #344e41单色渐变、森系园林设计、ESG报告、环保公益、植物研究单色系安全不会乱
12优雅与时尚#edafb8 #f7e1d7 #dedbd2 #b0c4b1 #4a5759低饱和、莫兰迪高定服装、艺术画廊、美妆品牌、杂志风留白是关键
13艺术与美食#335c67 #fff3b0 #e09f3e #9e2a2b #540b0e浓郁、复古画报美食纪录片、艺术展、民族风情、复古餐厅适合大色块拼接
14轻奢与神秘#22223b #4a4e69 #9a8c98 #c9ada7 #f2e9e4冷艳、紫调珠宝展示、酒店管理、高端咨询、心理学紫色营造高端氛围
15纯净科技蓝#03045e #0077b6 #00b4d8 #90e0ef #caf0f8未来感、纯净云计算/AI、水利海洋、医院医疗、洁净能源从深海到天空的渐变
16海岸珊瑚#0081a7 #00afb9 #fdfcdc #fed9b7 #f07167清爽、夏日感旅游度假、夏季活动、饮品品牌、海洋主题青色与珊瑚色互补亮眼
17活力橙薄荷#ff9f1c #ffbf69 #ffffff #cbf3f0 #2ec4b6明亮、欢快儿童活动、促销海报、快消品、社交媒体橙色吸睛,薄荷绿清爽
18铂金白金#0a0a0a #0070F3 #D4AF37 #f5f5f5 #ffffff高端、专业Agent产品、企业官网、金融科技、高端品牌白金主调,蓝色行动,金色强调

Agent Design System - 完整色板

基于 tokens.css/ts 的 Platinum White-Gold Theme,提供完整色阶供精细设计使用。

White 白色系(背景与浅色表面)

色阶色值用途
white-0#ffffff主背景
white-50#fefefe略带暖调的白
white-75#fcfcfc微灰白
white-100#fafafa次级背景
white-200#f7f7f7卡片背景
white-300#f5f5f5三级背景
white-400#f0f0f0分隔区域
white-500#ebebeb边框浅色
white-600#e5e5e5禁用态背景
white-700#e0e0e0深灰白
white-800#d9d9d9占位符
white-900#d4d4d4分隔线
white-1000#cccccc最深白

Gold 金色系(铂金商务强调色)

色阶色值用途
gold-25#FFFDF5极浅金背景
gold-50#FEF9E7浅金背景
gold-75#FCF3D0淡金高亮
gold-100#FAECB8金色 hover 态
gold-200#F5DC8A亮金强调
gold-300#E8C860金色悬停
gold-400#D4AF37主金色(核心)
gold-500#B8972E金色文字
gold-600#9A7E26深金强调
gold-700#7C651E暗金边框
gold-800#5E4C16深金背景
gold-900#40330F极深金
gold-1000#221A08黑金
Show full SKILL.md (194 more words)Show less

Blue 蓝色系(主操作色)

色阶色值用途
blue-25#F0F7FF极浅蓝背景
blue-50#E0EFFF信息提示背景
blue-75#C2DFFF浅蓝高亮
blue-100#A3CFFF禁用态蓝
blue-200#66AFFF亮蓝
blue-300#338FFF蓝色悬停
blue-400#0070F3主蓝色(核心)
blue-500#005FCC蓝色文字
blue-600#004FA6深蓝强调
blue-700#003F80暗蓝边框
blue-800#002F5A深蓝背景
blue-900#001F3D极深蓝
blue-1000#001026黑蓝

Gray 灰色系(文字与中性色)

色阶色值用途
gray-0#ffffff白色
gray-50#fafafa极浅灰
gray-75#f5f5f5浅灰背景
gray-100#ededed分隔线浅
gray-200#d4d4d4边框浅
gray-300#a3a3a3四级文字
gray-400#737373三级文字
gray-500#525252二级文字
gray-600#404040深灰
gray-700#2e2e2e暗色背景
gray-800#1f1f1f深色背景
gray-900#141414极深背景
gray-1000#0a0a0a主文字色(核心)

透明度色值

Opacity Black(黑色透明)
透明度色值用途
0%#0a0a0a00全透明
2%#0a0a0a05微弱遮罩
4%#0a0a0a0a次级交互背景
8%#0a0a0a14边框/分隔
15%#0a0a0a26按压态
20%#0a0a0a33浅遮罩
25%#0a0a0a40中遮罩
50%#0a0a0a80半透明
70%#0a0a0ab2深遮罩
80%#0a0a0acc悬停态
90%#0a0a0ae5tooltip
95%#0a0a0af2弹窗
Opacity White(白色透明)
透明度色值用途
0%#ffffff00全透明
2%#ffffff05微弱遮罩
4%#ffffff0a次级交互背景
8%#ffffff12边框/分隔
15%#ffffff26按压态
20%#ffffff33浅遮罩
25%#ffffff40中遮罩
50%#ffffff80半透明
70%#ffffffb2深遮罩
80%#ffffffcc悬停态
90%#ffffffe5tooltip
95%#fffffff2弹窗

Font Family - 字体规范

推荐字体

语言默认字体可选字体
中文微软雅黑 (Microsoft YaHei)—
英文ArialGeorgia, Calibri, Cambria, Trebuchet MS
  • 中英文混排时:中文使用微软雅黑,英文使用所选字体
  • 优先使用系统自带字体,确保跨平台兼容
  • 标题和正文可使用不同字体配对(如 Georgia + Calibri)

© haojing8312, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in apps/runtime/src-tauri/builtin-skills/pptx/skills/color-font-skill of haojing8312/WorkClaw.

Open the folder on GitHubat commit 81ae074

Used in 1 other repository

We found 1 copy of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in haojing8312/WorkClaw, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Color Font Skill next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Color Font Skill compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Color Font Skill this skillhaojing8312/WorkClaw1411 repos~1.4kAutomated safety check: PassApache-2.0
Design System Generatemohitagw15856/pm-claude-skills1.4k—~1.7kAutomated safety check: PassMIT
Impeccablebestofjs/bestofjs3.1k26 repos~2.6kAutomated safety check: PassMIT
Tailwindcss Developmentanonaddy/anonaddy4.9k10 repos~865Automated safety check: PassMIT
UI UX Pro Maxsaoudi-h/solar-icons19018 repos~11kAutomated safety check: NotesCustom licence
Scalar Design Systemscalar/scalar16k—~2.7kAutomated safety check: PassMIT

Similar skills

  • Design System Generate

    mohitagw15856/pm-claude-skills

    Generate a complete, accessibility-checked design system from scratch — colour ramps, type scale, spacing, elevation, and exports for CSS, Tailwind, design tokens, Figma, VS Code and PowerPoint.

    1.4k GitHub stars~1.7k tokensUpdated 2 days ago
    Frontend & DesignAuto-check passed
  • Impeccable

    bestofjs/bestofjs

    A skill your agent uses when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise improve a…

    3.1k GitHub starsUsed in 26 repos~2.6k tokens
    Frontend & DesignAuto-check passed
  • Tailwindcss Development

    anonaddy/anonaddy

    Always invoke when the user's message includes 'tailwind' in any form.

    4.9k GitHub starsUsed in 10 repos~865 tokens
    Frontend & DesignAuto-check passed
  • UI UX Pro Max

    saoudi-h/solar-icons

    UI/UX design intelligence for web and mobile. An agent skill from saoudi-h/solar-icons.

    190 GitHub starsUsed in 18 repos~11k tokens
    Frontend & DesignAuto-check: notes
  • Scalar's design system — design tokens, theming (@scalar/themes), CSS variables, and the @scalar/components library.

    16k GitHub stars~2.7k tokensUpdated yesterday
    Frontend & DesignAuto-check passed
  • Tailwind CSS Patterns

    ever-works/ever-works

    Provides comprehensive Tailwind CSS utility-first styling patterns including responsive design, layout utilities, flexbox, grid, spacing, typography, colors, and modern CSS best practices.

    162 GitHub starsUsed in 3 repos~1.6k tokens
    Frontend & DesignAuto-check: notes

More from haojing8312/WorkClaw

All 14 skills in this repo
  • Design Style Skill

    haojing8312/WorkClaw

    Select a consistent visual design system for PPT slides using radius/spacing style recipes.

    141 GitHub starsUsed in 1 repo~1.1k tokens
    Auto-check passed
  • Slack Messaging

    haojing8312/WorkClaw

    A skill your agent uses when asked to send or read Slack messages, check Slack channels, test Slack integrations, or interact with a Slack workspace from the command line.

    141 GitHub stars~897 tokensUpdated 4 mo ago
    Auto-check passed
  • Ppt Editing Skill

    haojing8312/WorkClaw

    Edit existing PowerPoint files or templates with XML-safe workflows.

    141 GitHub starsUsed in 1 repo~1.7k tokens
    Auto-check passed
  • Slide Making Skill

    haojing8312/WorkClaw

    Implement single-slide PowerPoint pages with PptxGenJS. An agent skill from haojing8312/WorkClaw.

    141 GitHub starsUsed in 1 repo~1.8k tokens
    Auto-check passed
  • Workclaw Change Verification

    haojing8312/WorkClaw

    A skill your agent uses when changes affect runtime code, tests, skill assets, or build and test behavior in WorkClaw and verification is required before claiming completion.

    141 GitHub stars~555 tokensUpdated 4 mo ago
    Auto-check passed
  • A skill your agent uses when changing runtime behavior, routing, provider integration, tool permissions, sidecar protocols, or vendor sync boundaries in WorkClaw before editing code.

    141 GitHub stars~575 tokensUpdated 4 mo ago
    Auto-check passed

Questions about Color Font Skill

What does Color Font Skill do?

Choose presentation-ready color palettes and font pairings for PPT/design tasks. Color Font Skill is an agent skill from haojing8312/WorkClaw. Choose presentation-ready color palettes and font pairings for PPT/design tasks.

When should I use Color Font Skill?

Color Font Skill fits situations like: users ask for visual theme choices; brand-safe palettes; font recommendations.

How do I install Color Font Skill in Claude Code?

Run `npx skills add haojing8312/WorkClaw --skill color-font-skill -a claude-code`. Or copy the skill folder (apps/runtime/src-tauri/builtin-skills/pptx/skills/color-font-skill in haojing8312/WorkClaw) into .claude/skills/color-font-skill in your project. Claude Code loads it when a task matches its description.

How do I install Color Font Skill in Codex?

Run `npx skills add haojing8312/WorkClaw --skill color-font-skill -a codex`. Or copy the skill folder (apps/runtime/src-tauri/builtin-skills/pptx/skills/color-font-skill in haojing8312/WorkClaw) into .agents/skills/color-font-skill in your project. Codex loads it when a task matches its description.

Can I use Color Font Skill in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add haojing8312/WorkClaw --skill color-font-skill -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/color-font-skill, .gemini/skills/color-font-skill, .github/skills/color-font-skill and .opencode/skills/color-font-skill in your project.

What does Color Font Skill need to run?

SKILL.md names no scripts, command-line tools or credentials: Color Font Skill is instructions for the agent only.

Does Color Font Skill access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Color Font Skill safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Color Font Skill use?

Color Font Skill is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Color Font Skill use?

About 1.4k tokens (SKILL.md is roughly 5.5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Color Font Skill?

Skills that share tags, products or a category with Color Font Skill: Design System Generate (mohitagw15856/pm-claude-skills, 1.4k stars), Impeccable (bestofjs/bestofjs, 3.1k stars), Tailwindcss Development (anonaddy/anonaddy, 4.9k stars) and UI UX Pro Max (saoudi-h/solar-icons, 190 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Color Font Skill?

haojing8312 (a GitHub user) maintains it in haojing8312/WorkClaw, which has 141 GitHub stars. The repository holds 14 skills in this directory. The repository was last updated on May 27, 2026.

Source: haojing8312/WorkClaw on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.