color-toolkit-turn

Solid

专业颜色工具集,支持颜色编码转换、对比度计算、智能颜色推荐、HTML预览生成。适用于UI设计、无障碍开发、配色方案生成等场景。

AI & Automation 2 stars 0 forks Updated today MIT

Install

View on GitHub

Quality Score: 81/100

Stars 20%
16
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
80
License 10%
100
Description 5%
100

Skill Content

# Color Toolkit - 专业颜色工具集 ## 触发条件 **正向触发:** - "把这个颜色转换一下" — 颜色编码转换(HEX/RGB/HSL/HSV/CMYK) - "计算这个颜色的对比度" — 对比度计算(WCAG/APCA/CIELAB/CIEDE2000) - "给我推荐一个配色方案" — 配色方案生成 - "这个颜色对盲人友好吗" — 无障碍(WCAG 合规性检查) - "生成这个颜色的预览页面" — HTML 预览生成 - "帮我推荐一个科技感的颜色" — 智能颜色推荐 - "随机生成几个颜色" — 随机颜色生成 **否定条件:** - 简单问答、闲聊、问候(不需要本技能) - 单步任务(不需要结构化执行) ## 核心能力 > 📚 **渐进式加载**:本技能采用渐进式 MD 体系,`SKILL.md` 为入口(≤230行),详细内容拆分到 `references/*.md` 按需加载。 ### 渐进式文件索引 | 文件名 | 分类 | 包含内容 | 审计关联 | | -------- |------| ---------- |----------| | `references/examples.md` | 输出示例 | 各功能输出格式示例 | R-25 | | `references/faq.md` | 常见问题 | 常见疑问与解答 | R-19 | | `references/antipatterns.md` | 规范指南 | 反模式与注意事项 | R-18 | | `references/changelog.md` | 版本管理 | 更新日志 | R-24 | | `references/features.md` | 功能说明 | 详细功能参数和输出示例 | R-17 | | `references/permissions.md` | 权限说明 | 权限风险与安全声明 | R-15, R-16 | | `references/LICENSE.md` | 许可协议 | MIT 开源许可证 | R-26 | Color Toolkit 是一个通用的颜色处理工具包,提供: - **颜色编码转换**:HEX ↔ RGB ↔ HSL ↔ HSV ↔ CMYK 全支持 - **对比度计算**:WCAG 2.1、APCA、CIELAB ΔE*ab、CIEDE2000 四种算法 - **无障碍推荐**:固定背景色推荐文字色,或固定文字色推荐背景色,按字号/字重/目标等级筛选(上限25种) - **调色板生成**:互补色(2色)、三色组(120°)、矩形四色组(90°)、类似色(30°间隔) - **互补色详情**:返回原色+互补色的完整编码信息 - **随机颜色生成**:自动生成饱和度和亮度适中的随机颜色 - **颜色格式验证**:校验字符串是否为合法颜色格式 - **多颜色比较**:同时对比多个颜色的色系、色温、亮度 - **智能颜色推荐**:根据用户描述生成完整配色方案 - **HTML预览生成**:单色/多色 HTML 预览,含色块、渐变、对比度、UI组件 ## 核心功能 ### 1. 颜色编码转换 ```text 输入格式支持: - HEX: #FF5733, #F53 - RGB: rgb(255, 87, 51), 255, 87, 51 - HSL: hsl(11, 100%, 60%), 11, 100, 60 - HSV: 11, 100, 60 - CMYK: 0, 66, 100, 0 ...

Details

Author
Ldxs001
Repository
Ldxs001/workbuddy-skills
Created
2 months ago
Last Updated
today
Language
Python
License
MIT

Similar Skills

Semantically similar based on skill content — not just same category

Web & Frontend Listed

color-palette-generator

You are an expert color theorist and accessible design specialist. When given a brand description or mood, generate a complete, accessible color palette with proper contrast ratios. ## Process 1. Understand the brand personality and mood 2. Select a primary color that embodies the brand 3. Build complementary, analogous, and accent colors 4. Verify WCAG contrast ratios for all text/background combinations 5. Provide usage guidelines for each color ## Output Format ### Color Palette: \[Brand Name\] Primary: #HEX — \[Name\] Secondary: #HEX — \[Name\] Accent: #HEX — \[Name\] Background: #HEX — \[Name\] Surface: #HEX — \[Name\] Text Primary: #HEX — \[Name\] Text Secondary: #HEX — \[Name\] ### Accessibility <table header-row='true'> <tr> <td>Combination</td> <td>Contrast Ratio</td> <td>WCAG AA</td> <td>WCAG...

0 Updated 1 weeks ago
prvthmpcypher
Web & Frontend Solid

color-accessibility-audit

Analyze color combinations for readability and accessibility compliance per WCAG 2.1/2.2 standards (Contrast Minimums 1.4.3 and Enhanced Contrast 1.4.6). Use this skill whenever the user shares a design, color palette, CSS, HTML, Tailwind config, theme file, screenshot of a UI, or mentions anything about text being hard to read, colors clashing, poor contrast, accessibility compliance (WCAG), or asks "can you check if these colors work together?" Also trigger when reviewing any frontend code, design tokens, or style sheets — even if the user doesn't explicitly ask about contrast. If colors are involved, check them. Covers: hex codes, RGB, HSL, named CSS colors, Tailwind classes, design tool exports, and UI screenshots. Includes color blindness simulation for Protanopia, Deuteranopia, and Tritanopia.

26 Updated 1 weeks ago
georgekhananaev
AI & Automation Solid

color-palette-extractor

Extract color palettes from images, websites, or designs. Identifies dominant colors, generates complementary schemes, and exports in multiple formats (HEX, RGB, HSL, Tailwind, CSS variables). Use when users need color schemes from images, brand colors, or design system palettes.

229 Updated 1 weeks ago
OneWave-AI