ckm:design

Generate brand identities, logos, CIP deliverables, and SVG icons for digital and print.

Updated Apr 2, 2026
One-click install
npx skills add https://github.com/hidonguyen/trade-ops --skill ckm-design-hidonguyen
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ckm:design
Source: https://github.com/hidonguyen/trade-ops/tree/main/.opencode/skills/design
Command: npx skills add https://github.com/hidonguyen/trade-ops --skill ckm-design-hidonguyen

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires google-genai, pillow, and includes scripts (resource) and references (resource) components.

What problem does it solve?

The design skill eliminates fragmented design workflows by unifying brand identity creation, tokenized design systems, AI-assisted logo and mockup generation, and multi-platform asset export into a single, scriptable toolkit. It reduces manual handoffs between designers, engineers, and marketing by producing production-ready assets, HTML previews, and presentation decks that integrate with existing codebases and automation pipelines.

Core Features & Use Cases

  • Logo Generation: 55+ styles, color palettes, prompt engineering and batch AI generation for vector-ready logos.
  • Corporate Identity Program (CIP): Generate briefs, 50+ deliverables, and photorealistic mockups; render portable HTML presentations of CIP outputs.
  • Slides & Presentations: HTML slide templates with Chart.js integration, layout patterns, and copywriting formulas for pitch decks and marketing presentations.
  • Banners & Social Images: 22 art-direction styles and platform-specific sizes with HTML → screenshot export workflows for Instagram, Facebook, LinkedIn, YouTube, Pinterest, TikTok, and Google Ads.
  • Icon Production: SVG icon generation and batch export using a text-based AI model with multi-size outputs and SVG best practices.
  • Integrations & Automation: Scripts that call Gemini models, perform BM25 searches for style guidance, render HTML, and capture exact-size screenshots via headless browser tooling for automated asset export.
  • Use Case Example: Create a new startup brand package: generate logos, produce CIP mockups with the logo embedded, assemble a pitch deck HTML, and export social banners sized for Instagram and LinkedIn.

Quick Start

Create a complete brand package for the brand TopGroup by generating logo variants, CIP mockups, and an HTML presentation in one run.

Frequently Asked Questions about ckm:design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a complete brand identity and social media assets in one workflow?

You can generate a complete brand identity and social assets by using a scriptable toolkit that produces logos, CIP mockups, and HTML presentations. It unifies brand creation, tokenized design systems, and multi-platform asset export into a single workflow.

How do I automatically export HTML banners to exact-size screenshots for Instagram and LinkedIn?

You can export HTML banners to exact-size screenshots using headless browser tooling. The workflow renders platform-specific HTML sizes and captures automated screenshots for social platforms like Instagram and LinkedIn.

Can I use Gemini APIs for AI logo generation and batch SVG icon export?

Yes, you can use Gemini APIs for AI logo generation and batch SVG icon export. The toolkit integrates with Gemini models to generate vector-ready logos and uses text-based AI models to batch export multi-size SVG icons.

Does this brand identity generator produce HTML presentation decks with Chart.js integration?

Yes, this brand identity generator produces HTML presentation decks with Chart.js integration. It provides HTML slide templates, layout patterns, and copywriting formulas to assemble pitch decks and marketing presentations.

What is the best way to create a Corporate Identity Program (CIP) with photorealistic mockups?

The best way to create a CIP with photorealistic mockups is using an automated generation toolkit. It produces CIP briefs, generates 50+ deliverables with embedded logos, and renders portable HTML presentations of the outputs.

Do I need Python and Pillow to run headless browser screenshot workflows for social banners?

Yes, you need Python and the Pillow library to run headless browser screenshot workflows. These dependencies support the underlying scripts that render HTML and capture exact-size screenshots for automated social banner export.