design

Generates logos, CIP mockups, SVG icons, banners, slides, and social images via Gemini AI and HTML rendering.

Updated Aug 26, 2026
One-click install
npx skills add https://github.com/danieliudi/trackforge-os --skill design-danieliudi
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design
Source: https://github.com/danieliudi/trackforge-os/tree/main/.cursor/skills/design
Command: npx skills add https://github.com/danieliudi/trackforge-os --skill design-danieliudi

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve? Producing brand assets like logos, corporate identity mockups, icons, banners, and social media images normally requires multiple design tools and manual resizing for each platform. This Skill centralizes those tasks into scriptable AI generation and HTML-to-screenshot workflows with platform-correct dimensions. ## Core Features & Use Cases - AI Logo & CIP Generation: Generate logos across 55+ styles and corporate identity mockups across 50+ deliverables using Gemini image models, with BM25 search over style, color, and industry guides. - SVG Icon Generation: Create SVG icons in 15 styles with batch variations and multi-size export using Gemini 3.1 Pro text output. - Banners, Slides & Social Photos: Design HTML/CSS banners and social images at exact platform sizes (Instagram, Facebook, LinkedIn, YouTube, Google Ads) and export via headless Chrome or Playwright screenshots; build Chart.js-based HTML pitch decks. - Use Case: A startup needs a full brand package: generate a minimalist logo, produce business card and signage mockups with that logo, then render an HTML presentation of the CIP set. ## Quick Start Ask the AI to design a minimalist logo for your brand and generate matching business card mockups using the design skill.

Frequently Asked Questions about design

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

FAQPage Schema
How do I generate a logo with Gemini AI?

Run scripts/logo/generate.py with --brand, --style, and --industry flags after setting GEMINI_API_KEY. You can first generate a design brief with scripts/logo/search.py using the --design-brief flag to pick from 55+ styles and 30 color palettes.

How to create corporate identity mockups with an existing logo?

Use scripts/cip/generate.py with --brand, --logo pointing to your logo file, --deliverable, and --industry. The --set flag generates a full CIP set, and --model pro switches to gemini-3-pro-image-preview for 4K text rendering.

What banner sizes does it support for social media and ads?

The banner reference covers Facebook covers (820x312), Twitter/X headers (1500x500), LinkedIn banners (1584x396), YouTube channel art (2560x1440), Instagram posts and stories, plus Google Display sizes like 300x250 and 728x90, and print specs at 300 DPI with bleed.

Can I generate SVG icons without an image generation API?

Yes. The icon script uses gemini-3.1-pro-preview, which outputs SVG as XML text, so no image generation endpoint is needed. It supports 15 styles, batch variations via --batch, and multi-size export via --sizes.

Why do my exported social images have wrong fonts or missing content?

Screenshots taken before fonts and images finish loading render incorrectly. Add a 3-5 second delay using --virtual-time-budget in headless Chrome or waitForTimeout in Playwright, then visually verify exports and re-export if issues remain.

What are the limitations of the social photos workflow?

It handles static social media images only via HTML/CSS rendering and screenshot export. It does not produce video, animation, print-ready CMYK files, or handle direct posting and scheduling to social platforms.