Prompt GitHub Copilot to Create a Brand Style Guide

GitHub Copilot, the AI development assistant integrated into code editors, can be a powerful ally for creating a complete and structured brand style guide. Whether you are a front-end developer looking to formalize a project's visual identity, a designer wanting to quickly generate a reference document, or a project manager needing a consistent graphical framework, Copilot helps you produce a detailed style guide covering color palette, typography, spacing, UI components, and logo usage rules. By leveraging its ability to generate structured code (CSS, design tokens, JSON configuration), Copilot transforms your creative intentions into technical specifications immediately usable by a development team. The prompt-based approach allows rapid iteration on graphic choices while maintaining overall consistency. Here is an optimized prompt to get the most out of GitHub Copilot in creating a professional brand style guide, accompanied by variants adapted to your expertise level.

The prompt

GitHub Copilot

Generate a complete brand style guide for a professional web project. Include the following elements in a structured format:

Color Palette: define a main palette (3-5 colors) and a secondary palette (3 neutral colors) with HEX, RGB, and HSL codes. Add light and dark variants for each main color. Generate corresponding CSS custom properties.
Typography: recommend a combination of 2 Google Fonts (headings + body text), define the complete typographic scale (h1 to h6, body, caption, overline) with sizes in rem, line-heights, and font-weights.
Spacing and Grid: define a spacing system based on a base unit of 8px, a responsive 12-column grid with breakpoints (mobile, tablet, desktop, large).
UI Components: specify styles for buttons (primary, secondary, outline, ghost), form fields, cards, alerts, and badges with their states (hover, focus, disabled, active).
Logo Usage Rules: protection zones, minimum sizes, variants (color, monochrome, inverted), usage prohibitions.
Design Tokens: export the whole set as a JSON design tokens file compatible with Style Dictionary.

Brand tone is modern, professional, and accessible. The industry is [TO SPECIFY].

Personalize this prompt with Léa

Answer 3 questions and Léa tailors the prompt to your situation.

Why it works

This prompt works because it breaks down the brand style guide into precise technical sections that Copilot can handle sequentially, each with concrete deliverables (CSS variables, JSON tokens). Specifying output formats (HEX, RGB, HSL, rem) eliminates ambiguity and forces an actionable response. The placeholder [TO SPECIFY] encourages user contextualization, which drastically improves the relevance of the generated graphic choices.

Expected result

You will obtain a structured document containing a consistent color palette with all variations, a harmonious typographic scale, a mathematically consistent spacing system, and detailed specifications for each UI component with their different states. Everything will be accompanied by CSS code ready to integrate and a JSON design tokens file usable with Style Dictionary or Figma Tokens.

Variants by level

FAQ

Can GitHub Copilot really create a professional-quality brand style guide?

GitHub Copilot excels at generating the technical part of a brand style guide: CSS variables, design tokens, spacing systems, and component specifications. It produces structured and consistent code that serves as an excellent foundation. However, creative choices (brand identity, conveyed emotions, visual originality) always require human artistic direction. The optimal approach is to use Copilot to generate the structure and technical specifications, then refine aesthetic choices with a designer or your own creative sensibility.

How do I adapt the prompt to my specific industry?

Replace the placeholder [to specify] or [INDUSTRY] with a precise description of your field and positioning. For example, instead of simply writing 'fintech', specify 'B2B fintech application targeting CFOs of SMEs, premium and reassuring positioning'. The richer the context, the better Copilot will adapt the color choices (institutional blue vs. creative purple), typography (classic serif vs. modern sans-serif), and overall tone of the style guide to your desired identity.

What output format should I use to integrate the style guide into my development workflow?

The most versatile format is Style Dictionary-compatible JSON design tokens. This format can be automatically transformed into CSS variables, SCSS, Swift files for iOS, XML for Android, or any other required format. If your team uses Figma, JSON tokens can be imported via the Figma Tokens plugin. For a simple project, CSS custom properties suffice and are directly usable. Specify the desired format in your prompt so Copilot structures its response accordingly.

How to use this prompt

Copy the prompt with the button above.
Paste it into ChatGPT, Claude or your favorite AI assistant.
Replace the bracketed variables with your details, then refine the result.

About Prompt Guide

Prompt Guide is a free library of 2500+ ready-to-use prompts for ChatGPT, Claude and other AIs, with guides to learn prompting and tools to build and optimize your own prompts.

Prompt library Learn prompting Prompt builder Prompt optimizer

Already have a prompt?

Paste it into the Optimizer, AI improves it in 5 seconds: role, context, format. Free, no signup.

Open the Optimizer

More prompts to explore

Prompt GitHub Copilot to Create Instagram Stories

GitHub Copilot, the AI-powered coding assistant, is not limited to writing traditional code. It also excels at generating visual components and templates for social media, especially Instagram Stories. By leveraging its HTML/CSS, SVG, and creative code generation capabilities, you can produce professional Story designs directly from your code editor.

Prompt GitHub Copilot to Summarize a Document

GitHub Copilot, the AI assistant developed by GitHub and powered by OpenAI's models, is not limited to code generation. Integrated directly into your editor, it also excels at summarizing technical documents, specifications, README files, or any documentation present in your project.

Prompt GitHub Copilot to Write a Cover Letter

GitHub Copilot, known primarily as a development assistant, also proves to be a formidable tool for writing professional documents like

Prompt GitHub Copilot to Write an Internal Memo

GitHub Copilot, the AI assistant integrated into code editors, also proves to be a valuable ally for writing internal corporate communications. Whether you're an HR manager, a team leader, or a communications team member, Copilot can help you structure and write clear, professional internal memos tailored to your audience.

Prompt GitHub Copilot to Write Terms of Service

Writing Terms of Service is a crucial legal step for any website or application. This document governs the relati

Prompt Sora for Creating a REST API

Sora, the artificial intelligence model developed by OpenAI, is primarily known for video generation, but its potential extends far beyond. In the context of software development, Sora can be used as an assistant to conceptualize, plan, and structure the creation of a complete REST API. By formulating a precise prompt, you can obtain a detailed architecture, well-defined endpoints, consistent data schemas, and security best practices. The prompt engineering approach turns an abstract idea into an exploitable technical specification in seconds. Whether you are a backend developer looking to speed up the design phase or a project manager wanting to produce preliminary technical documentation, mastering prompts for REST API creation will save you considerable time. This guide provides an optimized main prompt, variants tailored to your expertise level, and practical tips to get the most out of AI in your API development workflow.