メニュー
Design brand identity, logos, banners, posters, and visual assets. Use for brand systems, design tokens, corporate identity programs, event/editorial/marketing posters, and visual campaign assets. Not for UI code patterns.
デフォルトでは、最初にソースを確認する Prompt が選択されています。直接コマンドに切り替えるか、ローカルコピーをダウンロードすることもできます。
インストールを決める前に、SKILL.md と SkillsMP に表示されている付属ファイルをお読みください。
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
直接コマンドでは確認用 Prompt が省略されます。実行前にソースを確認してください。
npx skills add https://github.com/hoanghd218/ZaloCRM --skill ak-designコマンドは1行のまま表示されます。コピー前に横へスクロールして全体を確認してください。
ローカルで確認しますか？SkillsMP が現在取得できるファイルをダウンロードできます。
Search library/framework documentation via llms.txt (context7.com). Use for API docs, GitHub repository analysis, technical documentation lookup, latest library features.
Interview-driven advisory skill. Analyzes a prompt or URL (GitHub issue, spec, doc), scouts the codebase, interviews the user one question at a time to reframe the problem into exact requirements and goals, then delivers honest advice: what to do, what to avoid, better alternatives, benefits and trade-offs. Use when the user asks for advice, a second opinion, a sanity check, requirement reframing before committing to a direction, or wants an existing plan or design pressure-tested (grilled) one question at a time.
Browser and desktop automation through the agent-browser CLI. Use for long autonomous browsing, compact page snapshots, screenshots, form filling, login/test flows without real Chrome profile state, scraping, exploratory QA, cloud browsers, Electron apps, Slack automation, and bug hunts.
SKILL.md を表示中
| name | ak:design |
| description | Design brand identity, logos, banners, posters, and visual assets. Use for brand systems, design tokens, corporate identity programs, event/editorial/marketing posters, and visual campaign assets. Not for UI code patterns. |
| user-invocable | true |
| when_to_use | Invoke for brand systems and visual identity, not UI code. |
| category | frontend |
| keywords | ["brand","logo","CIP","banners","posters","identity"] |
| argument-hint | [design-type] [context] |
| license | MIT |
| metadata | {"author":"agentkit","version":"2.2.0"} |
Unified design skill: brand, tokens, UI, logo, CIP, slides, banners, social photos, icons, posters.
| 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 |
| Posters (event, editorial, marketing) | Poster (built-in) | references/poster-design.md |
55+ styles, 30 color palettes, 25 industry guides. Gemini Nano Banana models.
python3 scripts/logo/search.py "tech startup modern" --design-brief -p "BrandName"
python3 scripts/logo/search.py "minimalist clean" --domain style
python3 scripts/logo/search.py "tech professional" --domain color
python3 scripts/logo/search.py "healthcare medical" --domain industry
ALWAYS generate output logo images with white background.
python3 scripts/logo/generate.py --brand "TechFlow" --style minimalist --industry tech
python3 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 ask_user capability. If yes, invoke /ui-ux-pro-max for gallery.
50+ deliverables, 20 styles, 20 industries. Gemini Nano Banana (Flash/Pro).
python3 scripts/cip/search.py "tech startup" --cip-brief -b "BrandName"
python3 scripts/cip/search.py "business card letterhead" --domain deliverable
python3 scripts/cip/search.py "luxury premium elegant" --domain style
python3 scripts/cip/search.py "hospitality hotel" --domain industry
python3 scripts/cip/search.py "office reception" --domain mockup
# With logo (RECOMMENDED)
python3 scripts/cip/generate.py --brand "TopGroup" --logo /path/to/logo.png --deliverable "business card" --industry "consulting"
# Full CIP set
python3 scripts/cip/generate.py --brand "TopGroup" --logo /path/to/logo.png --industry "consulting" --set
# Pro model (4K text)
python3 scripts/cip/generate.py --brand "TopGroup" --logo logo.png --deliverable "business card" --model pro
# Without logo
python3 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)
python3 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.
Strategic HTML presentations with Chart.js, design tokens, copywriting formulas.
Load references/slides-create.md for the creation workflow.
| 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, and browser capture tools.
Load references/banner-sizes-and-styles.md for complete sizes and styles reference.
ask_user capability — purpose, platform, content, brand, style, quantityui-ux-pro-max, browse Pinterest for referencesfrontend-design, generate visuals with ai-artist/ai-multimodalak:agent-browser, Chrome headless, or Playwright| Platform | Type | Size (px) |
|---|---|---|
| Cover | 820 x 312 | |
| Twitter/X | Header | 1500 x 500 |
| Personal | 1584 x 396 | |
| YouTube | Channel art | 2560 x 1440 |
| Story | 1080 x 1920 | |
| 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 |
15 styles, 12 categories. Gemini 3.1 Pro Preview generates SVG text output.
python3 scripts/icon/generate.py --prompt "settings gear" --style outlined
python3 scripts/icon/generate.py --prompt "shopping cart" --style filled --color "#6366F1"
python3 scripts/icon/generate.py --name "dashboard" --category navigation --style duotone
python3 scripts/icon/generate.py --prompt "cloud upload" --batch 4 --output-dir ./icons
python3 scripts/icon/generate.py --prompt "user profile" --sizes "16,24,32,48" --output-dir ./icons
| 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.
20-30 curated styles x 15-20 palettes x 10-14 layouts x 8-12 textures. Model-agnostic: emits text prompts only, so the prompt can be sent to Gemini Nano Banana, GPT Image, Imagen, Midjourney, or another image model.
Three axes (style, palette, texture) stay locked per call to preserve identity; layout and variation seed can change for visible variety. Five calls with the same --style should read as one series while still producing distinct poster compositions.
Load references/poster-design.md for the full guide and references/poster-prompt-engineering.md for prompt anatomy and model-specific tweaks.
python3 scripts/poster/search.py --domain style --query "swiss editorial"
python3 scripts/poster/search.py --domain palette --query "warm earthy"
python3 scripts/poster/search.py --domain texture --query "risograph"
python3 scripts/poster/search.py --domain layout --query "centered grid"
python3 scripts/poster/search.py --poster-brief --topic "AI Conference" --query "minimal grid"
python3 scripts/poster/generate.py --topic "AI Conference"
python3 scripts/poster/generate.py --topic "AI Conference" --query "swiss" --aspect a2
python3 scripts/poster/generate.py --topic "AI Conference" --style "Swiss Editorial Grid" --seed 42
Pipe stdout into the selected image model. For a series, reuse --style and vary --seed.
# Vision analysis (resume-safe; needs GEMINI_API_KEY)
python3 scripts/poster/analyze.py --input-dir /path/to/posters
# Re-cluster + regenerate CSVs
python3 scripts/poster/cluster.py
Multi-platform social image design: HTML/CSS → screenshot export. Uses ui-ux-pro-max, brand, design-system, and browser capture tools.
Load references/social-photos-design.md for sizes, templates, best practices.
project-management skill for TODO tasks; parallel subagents for independent workask_user capabilitythe marketing brand skill → the marketing design-system skill → randomly invoke /ak:ui-ux-pro-max OR /ak:frontend-design; HTML per idea × sizeak:agent-browser, Chrome headless, or Playwright screenshot at exact px (2x deviceScaleFactor)chrome-devtools-mcp, ak:agent-browser, or Playwright to visually inspect exported designs; fix layout/styling issues and re-exportplans/reports/ with design decisionsassets-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 | 1200×627 | |
| YT Thumb | 1280×720 | 1000×1500 |
scripts/logo/generate.py → Generate logo variantsscripts/cip/generate.py --logo ... → Create deliverable mockupsreferences/slides-create.md → Build pitch deck| 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 |
| Poster Design Guide | references/poster-design.md |
| Poster Prompt Engineering | references/poster-prompt-engineering.md |
| 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 |
scripts/poster/search.py | Search poster styles, palettes, layouts, textures |
scripts/poster/generate.py | Generate model-agnostic poster prompts |
scripts/poster/analyze.py | Analyze poster references with Gemini vision |
scripts/poster/cluster.py | Rebuild poster clusters and CSV data |
export GEMINI_API_KEY="your-key" # https://aistudio.google.com/apikey
pip install google-genai pillow
External sub-skills: brand, design-system, ui-styling Related Skills: frontend-design, ui-ux-pro-max, ai-multimodal, agent-browser