Agent skill

Design

Comprehensive design skill: brand identity, design tokens, UI styling, logo generation (55 styles, Gemini AI), corporate identity program (50 deliverables, CIP mockups), HTML presentations…

MITAuto-check passedFrontend & Design

Install Design

skills CLI

$ npx skills add Ohh-889/skyroc --skill design -a claude-code

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

GitHub CLI

$ gh skill install Ohh-889/skyroc design --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/Ohh-889/skyroc.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/design .claude/skills/design && 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/

Paste into Claude Code

Install the "design" agent skill from https://github.com/Ohh-889/skyroc/tree/master/.agents/skills/design into .claude/skills/design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "design", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/Ohh-889/skyroc/tree/master/.agents/skills/design

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add Ohh-889/skyroc --skill design -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install Ohh-889/skyroc design --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/Ohh-889/skyroc.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/design .agents/skills/design && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "design" agent skill from https://github.com/Ohh-889/skyroc/tree/master/.agents/skills/design into .agents/skills/design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "design", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add Ohh-889/skyroc --skill design -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install Ohh-889/skyroc design --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/Ohh-889/skyroc.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/design .cursor/skills/design && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "design" agent skill from https://github.com/Ohh-889/skyroc/tree/master/.agents/skills/design into .cursor/skills/design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "design", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/Ohh-889/skyroc.git --path .agents/skills/design

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add Ohh-889/skyroc --skill design -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install Ohh-889/skyroc design --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/Ohh-889/skyroc.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/design .gemini/skills/design && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "design" agent skill from https://github.com/Ohh-889/skyroc/tree/master/.agents/skills/design into .gemini/skills/design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "design", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install Ohh-889/skyroc design

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add Ohh-889/skyroc --skill design -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/Ohh-889/skyroc.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/design .github/skills/design && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "design" agent skill from https://github.com/Ohh-889/skyroc/tree/master/.agents/skills/design into .github/skills/design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "design", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add Ohh-889/skyroc --skill design -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install Ohh-889/skyroc design --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/Ohh-889/skyroc.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/design .opencode/skills/design && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "design" agent skill from https://github.com/Ohh-889/skyroc/tree/master/.agents/skills/design into .opencode/skills/design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "design", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: design
GitHub stars: 795
Used in: 9 other repos
Token cost: ~3.1k tokens
SKILL.md length: 901 words
Files: 39 (incl. scripts, references)
Skills in repo: 18
Repo updated: Sep 1, 2026
First seen: Oct 7, 2026
Licence: MIT

At a glance

Comprehensive design skill: brand identity, design tokens, UI styling, logo generation (55 styles, Gemini AI), corporate identity program (50 deliverables, CIP mockups), HTML presentations…

Works in 5 steps: Gather requirements via AskUserQuestion… → Research — Activate ui-ux-pro-max,… → Design — Create HTML/CSS banner with… → …
Tasks that involve Slides and decks
SKILL.md covers When to Use, Sub-skill Routing, Logo Design (Built-in) and CIP Design (Built-in), plus 5 more sections
Calls python3, python and pip; reaches aistudio.google.com; needs GEMINI_API_KEY

What it does

Design is an agent skill from Ohh-889/skyroc. Comprehensive design skill: brand identity, design tokens, UI styling, logo generation (55 styles, Gemini AI), corporate identity program (50 deliverables, CIP mockups), HTML presentations (Chart.js), banner design (22 styles, social/ads/web/print), icon design (15 styles, SVG, Gemini 3.1 Pro), social photos (HTML→screenshot, multi-platform). Actions: design logo, create CIP, generate mockups, build slides, design banner, generate icon, create social photos, social media images, brand identity, design system…

Its SKILL.md is about 3.1k tokens, which your agent loads only when the skill is triggered. The skill folder holds 43 other files, including scripts and reference files (for example `references/banner-sizes-and-styles.md`, `references/cip-deliverable-guide.md` and `references/cip-design.md`).

It sits in Frontend & Design, covering Slides and decks, Brand strategy and identity and Design tokens. It works with Chart.js, Instagram, LinkedIn and Pinterest. The repository describes itself as: Skyroc 是一个基于 React 19 + TypeScript 的跨端前端工程化 monorepo：既提供开箱即用的 Web 中后台模板（Admin / RuoYi 对接版）和 Expo 移动端业务模板，也把请求、状态、日志、主题、双端 UI 组件库等能力沉淀为边界清晰的 workspace 包。 The licence is MIT.

When your agent uses it

Tasks that involve Slides and decks
Tasks that involve Brand strategy and identity
Tasks that involve Design tokens

Example prompts

“/design”

Requirements

Python 3
A credential in GEMINI_API_KEY

Workflow steps

5 steps, taken from the first numbered list in SKILL.md.

Gather requirements via AskUserQuestion — purpose, platform, content, brand, style, quantity
Research — Activate ui-ux-pro-max, browse Pinterest for references
Design — Create HTML/CSS banner with frontend-design, generate visuals with ai-artist/ai-multimodal
Export — Screenshot to PNG at exact dimensions via chrome-devtools
Present — Show all options side-by-side, iterate on feedback

What it can do on your machine

Read from SKILL.md and the folder at commit 10ddd27. 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
Ships 1 file in scripts/, which the agent can run.
Shell commands in SKILL.md call:
- python3
- python
- pip
From the folder's file list and the shell code blocks in SKILL.md.
Network
Hosts in commands or code, which the agent is likely to contact:
- aistudio.google.com
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names these keys or tokens, usually read from environment variables:
- GEMINI_API_KEY
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Design loads about 3.1k tokens when it runs, and up to ~21k if it reads all its reference files. Until then it costs about 155 tokens; SKILL.md has 901 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~155
When it runs · the whole SKILL.md, loaded when a task matches: ~3.1k
With references · SKILL.md plus every file in references/, read only if the agent opens them: ~21k

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); the scripts in this folder are not scanned.

SKILL.md

The full file from Ohh-889/skyroc at commit 10ddd27, republished under its MIT licence (© Ohh-889). 901 words, ~3,065 tokens.

Download SKILL.mdSave it as .claude/skills/design/SKILL.md (or your agent's skills folder). This skill also uses 38 other files; get the full folder from GitHub.

name: design
description: Comprehensive design skill: brand identity, design tokens, UI styling, logo generation (55 styles, Gemini AI), corporate identity program (50 deliverables, CIP mockups), HTML presentations (Chart.js), banner design (22 styles, social/ads/web/print), icon design (15 styles, SVG, Gemini 3.1 Pro), social photos (HTML→screenshot, multi-platform). Actions: design logo, create CIP, generate mockups, build slides, design banner, generate icon, create social photos, social media images, brand identity, design system. Platforms: Facebook, Twitter, LinkedIn, YouTube, Instagram, Pinterest, TikTok, Threads, Google Ads.
argument-hint: [design-type] [context]
license: MIT
metadata.author: claudekit
metadata.version: 2.1.0

Design

Unified design skill: brand, tokens, UI, logo, CIP, slides, banners, social photos, icons.

When to Use

Brand identity, voice, assets
Design system tokens and specs
UI styling with shadcn/ui + Tailwind
Logo design and AI generation
Corporate identity program (CIP) deliverables
Presentations and pitch decks
Banner design for social media, ads, web, print
Social photos for Instagram, Facebook, LinkedIn, Twitter, Pinterest, TikTok

Sub-skill Routing

Task	Sub-skill	Details
Brand identity, voice, assets	`brand`	External skill
Tokens, specs, CSS vars	`design-system`	External skill
shadcn/ui, Tailwind, code	`ui-styling`	External skill
Logo creation, AI generation	Logo (built-in)	`references/logo-design.md`
CIP mockups, deliverables	CIP (built-in)	`references/cip-design.md`
Presentations, pitch decks	Slides (built-in)	`references/slides.md`
Banners, covers, headers	Banner (built-in)	`references/banner-sizes-and-styles.md`
Social media images/photos	Social Photos (built-in)	`references/social-photos-design.md`
SVG icons, icon sets	Icon (built-in)	`references/icon-design.md`

Logo Design (Built-in)

55+ styles, 30 color palettes, 25 industry guides. Gemini Nano Banana models.

Logo: Generate Design Brief

bash

python3 ~/.claude/skills/design/scripts/logo/search.py "tech startup modern" --design-brief -p "BrandName"

Logo: Search Styles/Colors/Industries

bash

python3 ~/.claude/skills/design/scripts/logo/search.py "minimalist clean" --domain style
python3 ~/.claude/skills/design/scripts/logo/search.py "tech professional" --domain color
python3 ~/.claude/skills/design/scripts/logo/search.py "healthcare medical" --domain industry

Logo: Generate with AI

ALWAYS generate output logo images with white background.

bash

python3 ~/.claude/skills/design/scripts/logo/generate.py --brand "TechFlow" --style minimalist --industry tech
python3 ~/.claude/skills/design/scripts/logo/generate.py --prompt "coffee shop vintage badge" --style vintage

IMPORTANT: When scripts fail, try to fix them directly.

After generation, ALWAYS ask user about HTML preview via AskUserQuestion. If yes, invoke /ui-ux-pro-max for gallery.

CIP Design (Built-in)

50+ deliverables, 20 styles, 20 industries. Gemini Nano Banana (Flash/Pro).

CIP: Generate Brief

bash

python3 ~/.claude/skills/design/scripts/cip/search.py "tech startup" --cip-brief -b "BrandName"

CIP: Search Domains

bash

python3 ~/.claude/skills/design/scripts/cip/search.py "business card letterhead" --domain deliverable
python3 ~/.claude/skills/design/scripts/cip/search.py "luxury premium elegant" --domain style
python3 ~/.claude/skills/design/scripts/cip/search.py "hospitality hotel" --domain industry
python3 ~/.claude/skills/design/scripts/cip/search.py "office reception" --domain mockup

CIP: Generate Mockups

bash

# With logo (RECOMMENDED)
python3 ~/.claude/skills/design/scripts/cip/generate.py --brand "TopGroup" --logo /path/to/logo.png --deliverable "business card" --industry "consulting"

# Full CIP set
python3 ~/.claude/skills/design/scripts/cip/generate.py --brand "TopGroup" --logo /path/to/logo.png --industry "consulting" --set

# Pro model (4K text)
python3 ~/.claude/skills/design/scripts/cip/generate.py --brand "TopGroup" --logo logo.png --deliverable "business card" --model pro

# Without logo
python3 ~/.claude/skills/design/scripts/cip/generate.py --brand "TechFlow" --deliverable "business card" --no-logo-prompt

Models: flash (default, gemini-2.5-flash-image), pro (gemini-3-pro-image-preview)

CIP: Render HTML Presentation

bash

python3 ~/.claude/skills/design/scripts/cip/render-html.py --brand "TopGroup" --industry "consulting" --images /path/to/cip-output

Tip: If no logo exists, use Logo Design section above first.

Slides (Built-in)

Strategic HTML presentations with Chart.js, design tokens, copywriting formulas.

Load references/slides-create.md for the creation workflow.

Slides: Knowledge Base

Topic	File
Creation Guide	`references/slides-create.md`
Layout Patterns	`references/slides-layout-patterns.md`
HTML Template	`references/slides-html-template.md`
Copywriting	`references/slides-copywriting-formulas.md`
Strategies	`references/slides-strategies.md`

22 art direction styles across social, ads, web, print. Uses frontend-design, ai-artist, ai-multimodal, chrome-devtools skills.

Load references/banner-sizes-and-styles.md for complete sizes and styles reference.

Gather requirements via AskUserQuestion — purpose, platform, content, brand, style, quantity
Research — Activate ui-ux-pro-max, browse Pinterest for references
Design — Create HTML/CSS banner with frontend-design, generate visuals with ai-artist/ai-multimodal
Export — Screenshot to PNG at exact dimensions via chrome-devtools
Present — Show all options side-by-side, iterate on feedback

Platform	Type	Size (px)
Facebook	Cover	820 x 312
Twitter/X	Header	1500 x 500
LinkedIn	Personal	1584 x 396
YouTube	Channel art	2560 x 1440
Instagram	Story	1080 x 1920
Instagram	Post	1080 x 1080
Google Ads	Med Rectangle	300 x 250
Website	Hero	1920 x 600-1080

Style	Best For
Minimalist	SaaS, tech
Bold Typography	Announcements
Gradient	Modern brands
Photo-Based	Lifestyle, e-com
Geometric	Tech, fintech
Glassmorphism	SaaS, apps
Neon/Cyberpunk	Gaming, events

Safe zones: critical content in central 70-80%
One CTA per banner, bottom-right, min 44px height
Max 2 fonts, min 16px body, ≥32px headline
Text under 20% for ads (Meta penalizes)
Print: 300 DPI, CMYK, 3-5mm bleed

Icon Design (Built-in)

15 styles, 12 categories. Gemini 3.1 Pro Preview generates SVG text output.

Icon: Generate Single Icon

bash

python3 ~/.claude/skills/design/scripts/icon/generate.py --prompt "settings gear" --style outlined
python3 ~/.claude/skills/design/scripts/icon/generate.py --prompt "shopping cart" --style filled --color "#6366F1"
python3 ~/.claude/skills/design/scripts/icon/generate.py --name "dashboard" --category navigation --style duotone

Icon: Generate Batch Variations

bash

python3 ~/.claude/skills/design/scripts/icon/generate.py --prompt "cloud upload" --batch 4 --output-dir ./icons

Icon: Multi-size Export

bash

python3 ~/.claude/skills/design/scripts/icon/generate.py --prompt "user profile" --sizes "16,24,32,48" --output-dir ./icons

Icon: Top Styles

Style	Best For
outlined	UI interfaces, web apps
filled	Mobile apps, nav bars
duotone	Marketing, landing pages
rounded	Friendly apps, health
sharp	Tech, fintech, enterprise
flat	Material design, Google-style
gradient	Modern brands, SaaS

Model: gemini-3.1-pro-preview — text-only output (SVG is XML text). No image generation API needed.

Show full SKILL.md (368 more words)Show less

Multi-platform social image design: HTML/CSS → screenshot export. Uses ui-ux-pro-max, brand, design-system, chrome-devtools skills.

Load references/social-photos-design.md for sizes, templates, best practices.

Orchestrate — project-management skill for TODO tasks; parallel subagents for independent work
Analyze — Parse prompt: subject, platforms, style, brand context, content elements
Ideate — 3-5 concepts, present via AskUserQuestion
Design — /ckm:brand → /ckm:design-system → randomly invoke /ck:ui-ux-pro-max OR /ck:frontend-design; HTML per idea × size
Export — chrome-devtools or Playwright screenshot at exact px (2x deviceScaleFactor)
Verify — Use Chrome MCP or chrome-devtools skill to visually inspect exported designs; fix layout/styling issues and re-export
Report — Summary to plans/reports/ with design decisions
Organize — Invoke assets-organizing skill to sort output files and reports

Platform	Size (px)	Platform	Size (px)
IG Post	1080×1080	FB Post	1200×630
IG Story	1080×1920	X Post	1200×675
IG Carousel	1080×1350	LinkedIn	1200×627
YT Thumb	1280×720	Pinterest	1000×1500

Workflows

Complete Brand Package

Logo → scripts/logo/generate.py → Generate logo variants
CIP → scripts/cip/generate.py --logo ... → Create deliverable mockups
Presentation → Load references/slides-create.md → Build pitch deck

New Design System

Brand (brand skill) → Define colors, typography, voice
Tokens (design-system skill) → Create semantic token layers
Implement (ui-styling skill) → Configure Tailwind, shadcn/ui

References

Topic	File
Design Routing	`references/design-routing.md`
Logo Design Guide	`references/logo-design.md`
Logo Styles	`references/logo-style-guide.md`
Logo Colors	`references/logo-color-psychology.md`
Logo Prompts	`references/logo-prompt-engineering.md`
CIP Design Guide	`references/cip-design.md`
CIP Deliverables	`references/cip-deliverable-guide.md`
CIP Styles	`references/cip-style-guide.md`
CIP Prompts	`references/cip-prompt-engineering.md`
Slides Create	`references/slides-create.md`
Slides Layouts	`references/slides-layout-patterns.md`
Slides Template	`references/slides-html-template.md`
Slides Copy	`references/slides-copywriting-formulas.md`
Slides Strategy	`references/slides-strategies.md`
Banner Sizes & Styles	`references/banner-sizes-and-styles.md`
Social Photos Guide	`references/social-photos-design.md`
Icon Design Guide	`references/icon-design.md`

Scripts

Script	Purpose
`scripts/logo/search.py`	Search logo styles, colors, industries
`scripts/logo/generate.py`	Generate logos with Gemini AI
`scripts/logo/core.py`	BM25 search engine for logo data
`scripts/cip/search.py`	Search CIP deliverables, styles, industries
`scripts/cip/generate.py`	Generate CIP mockups with Gemini
`scripts/cip/render-html.py`	Render HTML presentation from CIP mockups
`scripts/cip/core.py`	BM25 search engine for CIP data
`scripts/icon/generate.py`	Generate SVG icons with Gemini 3.1 Pro

Prerequisites

Python: This skill uses Python scripts. On Windows, use python instead of python3 (e.g., python scripts/logo/search.py instead of python3 scripts/logo/search.py).

Check if Python is installed:

bash

python3 --version || python --version

Setup

bash

export GEMINI_API_KEY="your-key"  # https://aistudio.google.com/apikey
pip install google-genai pillow

Note for Windows: Use python instead of pip where needed (e.g., python -m pip install ...).

Integration

External sub-skills: brand, design-system, ui-styling Related Skills: frontend-design, ui-ux-pro-max, ai-multimodal, chrome-devtools

Files

SKILL.md and 38 other files (scripts, references) in .agents/skills/design of Ohh-889/skyroc.

SKILL.md
data/cip/deliverables.csv
data/cip/industries.csv
data/cip/mockup-contexts.csv
data/cip/styles.csv
data/icon/styles.csv
data/logo/colors.csv
data/logo/industries.csv
data/logo/styles.csv
references/banner-sizes-and-styles.md
references/cip-deliverable-guide.md
references/cip-design.md
references/cip-prompt-engineering.md
references/cip-style-guide.md
references/design-routing.md
references/icon-design.md
… and 23 more

Open the folder on GitHubat commit 10ddd27

Used in 9 other repositories

We found 14 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 9 other GitHub owners. This page covers the copy in Ohh-889/skyroc, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Design 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.

Design compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
Design this skillOhh-889/skyroc	795	9 repos	~3.1k	Automated safety check: Pass	MIT	1 mo ago
Brand and Design Toolkitnextlevelbuilder/ui-ux-pro-max-skill	134k	1 repos	~3.5k	Automated safety check: Pass	MIT	today
Socialcoreyhaines31/marketingskills	54k	4 repos	~4.5k	Automated safety check: Pass	MIT	yesterday
Carousel Writer Smsblacktwist/social-media-skills	559	—	~4.1k	Automated safety check: Pass	MIT	5 mo ago
Schedule Socialindranilbanerjee/digital-marketing-pro	859	1 repos	~3.4k	Automated safety check: Pass	MIT	6 days ago
Brand DesignEliasOulkadi/shokunin	114	—	~3k	Automated safety check: Pass	MIT	5 days ago

Similar skills

Brand and Design Toolkit
nextlevelbuilder/ui-ux-pro-max-skill
Bundles design tasks behind one skill: brand identity, tokens, UI styling, logos, corporate identity mockups, slides, banners, icons and social images.
134k GitHub starsUsed in 1 repo~3.5k tokens
Media & CreativeAuto-check passed
Social
coreyhaines31/marketingskills
When the user wants help creating, scheduling, or optimizing social media content for LinkedIn, Twitter/X, Instagram, TikTok, or Facebook, or wants to do social listening and engagement triage.
54k GitHub starsUsed in 4 repos~4.5k tokens
Writing & ContentAuto-check passed
Carousel Writer Sms
blacktwist/social-media-skills
When the user wants to write content for a LinkedIn carousel, Instagram carousel, Facebook carousel, TikTok photo carousel, Pinterest Idea Pin, or any swipeable multi-slide format.
559 GitHub stars~4.1k tokensUpdated 5 mo ago
Documents & OfficeAuto-check passed
Schedule Social
indranilbanerjee/digital-marketing-pro
Schedule social posts to Twitter/X, Instagram, LinkedIn, TikTok, YouTube, and Pinterest through connected platform MCPs — generating per-platform copy variations, hashtag mixes, media-spec…
859 GitHub starsUsed in 1 repo~3.4k tokens
Writing & ContentAuto-check passed
Brand Design
EliasOulkadi/shokunin
Generate brand guidelines, design systems with design tokens (W3C format), creative direction (SCAMPER, Design Thinking, TRIZ), and design briefs with scope and success criteria.
114 GitHub stars~3k tokensUpdated 5 days ago
Frontend & DesignAuto-check passed
Social Media Management
manojbajaj95/claude-gtm-plugin
Comprehensive social media management for all platforms (LinkedIn, Twitter/X, Instagram, TikTok, Facebook, Pinterest, YouTube).
105 GitHub starsUsed in 1 repo~3.9k tokens
Writing & ContentAuto-check passed

Questions about Design

What does Design do?

Comprehensive design skill: brand identity, design tokens, UI styling, logo generation (55 styles, Gemini AI), corporate identity program (50 deliverables, CIP mockups), HTML presentations…. Design is an agent skill from Ohh-889/skyroc.1 Pro), social photos (HTML→screenshot, multi-platform).

When should I use Design?

Design fits situations like: tasks that involve Slides and decks; tasks that involve Brand strategy and identity; tasks that involve Design tokens.

How do I install Design in Claude Code?

Run `npx skills add Ohh-889/skyroc --skill design -a claude-code`. Or copy the skill folder (.agents/skills/design in Ohh-889/skyroc) into .claude/skills/design in your project. Claude Code loads it when a task matches its description.

How do I install Design in Codex?

Run `npx skills add Ohh-889/skyroc --skill design -a codex`. Or copy the skill folder (.agents/skills/design in Ohh-889/skyroc) into .agents/skills/design in your project. Codex loads it when a task matches its description.

Can I use Design 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 Ohh-889/skyroc --skill design -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/design, .gemini/skills/design, .github/skills/design and .opencode/skills/design in your project.

What does Design need to run?

Going by SKILL.md and its folder, Design needs the command-line tools its instructions call (python3, python and pip) and credentials named GEMINI_API_KEY. Our summary lists: Python 3; A credential in GEMINI_API_KEY.

Does Design access the network?

SKILL.md names 1 domain. In commands or code: aistudio.google.com; the agent is likely to contact it when it follows the instructions. This is read from the text; nothing was executed.

Is Design 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. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.

What licence does Design use?

Design is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Design use?

About 3.1k tokens (SKILL.md is roughly 12k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 18k tokens, read only when the agent opens those files.

What are the alternatives to Design?

Skills that share tags, products or a category with Design: Brand and Design Toolkit (nextlevelbuilder/ui-ux-pro-max-skill, 134k stars), Social (coreyhaines31/marketingskills, 54k stars), Carousel Writer Sms (blacktwist/social-media-skills, 559 stars) and Schedule Social (indranilbanerjee/digital-marketing-pro, 859 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Design?

Ohh-889 (a GitHub user) maintains it in Ohh-889/skyroc, which has 795 GitHub stars. The repository holds 18 skills in this directory. The repository was last updated on September 1, 2026.

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

Install Design

Facts

At a glance

What it does

When your agent uses it

Example prompts

Requirements

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

Design

When to Use

Sub-skill Routing

Logo Design (Built-in)

Logo: Generate Design Brief

Logo: Search Styles/Colors/Industries

Logo: Generate with AI

CIP Design (Built-in)

CIP: Generate Brief

CIP: Search Domains

CIP: Generate Mockups

CIP: Render HTML Presentation

Slides (Built-in)

Slides: Knowledge Base

Banner Design (Built-in)

Banner: Workflow

Banner: Quick Size Reference

Banner: Top Art Styles

Banner: Design Rules

Icon Design (Built-in)

Icon: Generate Single Icon

Icon: Generate Batch Variations

Icon: Multi-size Export

Icon: Top Styles

Social Photos (Built-in)

Social Photos: Workflow

Social Photos: Key Sizes

Workflows

Complete Brand Package

New Design System

References

Scripts

Prerequisites

Setup

Integration

Files

Used in 9 other repositories

Compare with similar skills

Similar skills

More from Ohh-889/skyroc

Related

Questions about Design