主题配色
theme
by BytesAgain
Generate and manage UI color themes using CLI tools. Use when you need to create, preview, apply, import, or export dark/light mode themes, palettes,
安装
claude skill add --url github.com/openclaw/skills/tree/main/skills/bytesagain/theme文档
Theme — UI Theme Generation and Management
A thorough CLI tool for creating, managing, and exporting UI color themes. Supports light/dark mode generation, color palette creation, theme previewing, design token export, random theme generation, and full CRUD operations on saved themes.
Prerequisites
- Python 3.8+
- Bash shell
Data Storage
All theme data is persisted in ~/.theme/data.jsonl. Each line is a JSON object representing a theme with its name, colors, mode, and metadata. Themes include primary, secondary, background, surface, text, error, warning, success, and info colors.
Commands
Run all commands via the script at scripts/script.sh.
create
Create a new theme with specified colors.
bash scripts/script.sh create <theme_name> --primary "#6200EE" --secondary "#03DAC6" [--background "#FFFFFF"] [--surface "#F5F5F5"] [--text "#212121"] [--mode light]
apply
Mark a theme as active/applied.
bash scripts/script.sh apply <theme_name>
list
List all saved themes.
bash scripts/script.sh list [--format table|json] [--mode dark|light]
edit
Edit properties of an existing theme.
bash scripts/script.sh edit <theme_name> [--primary "#BB86FC"] [--secondary "#03DAC6"] [--mode dark] [--rename new_name]
export
Export a theme to CSS, JSON, SCSS, or Tailwind format.
bash scripts/script.sh export <theme_name> [--format css|json|scss|tailwind] [--output theme.css]
import
Import a theme from a JSON file.
bash scripts/script.sh import <file_path> [--name override_name]
preview
Preview a theme with colored terminal output or generate HTML preview.
bash scripts/script.sh preview <theme_name> [--html] [--output preview.html]
dark
Auto-generate a dark mode variant from an existing theme.
bash scripts/script.sh dark <theme_name> [--name dark_variant_name] [--save]
light
Auto-generate a light mode variant from an existing theme.
bash scripts/script.sh light <theme_name> [--name light_variant_name] [--save]
palette
Generate a color palette from a base color (complementary, analogous, triadic, etc.).
bash scripts/script.sh palette <base_color> [--type complementary|analogous|triadic|split-complementary] [--count 5]
random
Generate a random theme with harmonious colors.
bash scripts/script.sh random [--mode dark|light] [--name random_theme] [--save]
help
Show usage information and available commands.
bash scripts/script.sh help
version
Show the current version of the theme tool.
bash scripts/script.sh version
Workflow Example
# Create a light theme
bash scripts/script.sh create ocean --primary "#0077B6" --secondary "#00B4D8" --mode light
# Auto-generate dark variant
bash scripts/script.sh dark ocean --name ocean-dark --save
# Preview it
bash scripts/script.sh preview ocean-dark
# Generate a palette
bash scripts/script.sh palette "#0077B6" --type analogous --count 5
# Export as CSS custom properties
bash scripts/script.sh export ocean --format css --output ocean-theme.css
# Generate random theme
bash scripts/script.sh random --mode dark --name midnight --save
Export Formats
- CSS: Custom properties (
:root { --primary: #6200EE; }) - SCSS: Variables (
$primary: #6200EE;) - JSON: Structured object for programmatic use
- Tailwind: Tailwind config
extend.colorsobject
Notes
- Dark/light mode auto-generation adjusts luminance, contrast, and saturation.
- Random themes use color harmony algorithms for aesthetically pleasing results.
- Palette generation supports multiple color theory models.
- All themes are portable via export/import.
Powered by BytesAgain | bytesagain.com | hello@bytesagain.com
相关 Skills
Slack动图
by anthropics
面向Slack的动图制作Skill,内置emoji/消息GIF的尺寸、帧率和色彩约束、校验与优化流程,适合把创意或上传图片快速做成可直接发送的Slack动画。
✎ 帮你快速做出适配 Slack 的动图,内置约束规则和校验工具,少踩上传与播放坑,做表情包和演示都更省心。
MCP构建
by anthropics
聚焦高质量 MCP Server 开发,覆盖协议研究、工具设计、错误处理与传输选型,适合用 FastMCP 或 MCP SDK 对接外部 API、封装服务能力。
✎ 想让 LLM 稳定调用外部 API,就用 MCP构建:从 Python 到 Node 都有成熟指引,帮你更快做出高质量 MCP 服务器。
接口测试套件
by alirezarezvani
扫描 Next.js、Express、FastAPI、Django REST 的 API 路由,自动生成覆盖鉴权、参数校验、错误码、分页、上传与限流场景的 Vitest 或 Pytest 测试套件。
✎ 帮你把API与集成测试自动化跑顺,减少回归漏测;能力全面,尤其适合复杂接口场景的QA团队。
相关 MCP 服务
Slack 消息
编辑精选by Anthropic
Slack 是让 AI 助手直接读写你的 Slack 频道和消息的 MCP 服务器。
✎ 这个服务器解决了团队协作中需要 AI 实时获取 Slack 信息的痛点,特别适合开发团队让 Claude 帮忙汇总频道讨论或发送通知。不过,它目前只是参考实现,文档有限,不建议在生产环境直接使用——更适合开发者学习 MCP 如何集成第三方服务。
by netdata
io.github.netdata/mcp-server 是让 AI 助手实时监控服务器指标和日志的 MCP 服务器。
✎ 这个工具解决了运维人员需要手动检查系统状态的痛点,最适合 DevOps 团队让 Claude 自动分析性能数据。不过,它依赖 NetData 的现有部署,如果你没用过这个监控平台,得先花时间配置。
by d4vinci
Scrapling MCP Server 是专为现代网页设计的智能爬虫工具,支持绕过 Cloudflare 等反爬机制。
✎ 这个工具解决了爬取动态网页和反爬网站时的头疼问题,特别适合需要批量采集电商价格或新闻数据的开发者。不过,它依赖外部浏览器引擎,资源消耗较大,不适合轻量级任务。