How do I initialize this skill?

Copy the template into your project, rename it to brand-identity, and populate the resource files with your brand specifics; replace the placeholder brand name.

Where should brand tokens and tech choices live?

Brand tokens go in resources/design-tokens.json, tech choices in resources/tech-stack.md, and voice/tone in resources/voice-tone.md.

How does this improve consistency?

It centralizes constraints and guidelines, ensuring UI, copy, and assets pull from a single source of truth across all outputs.

providing-brand-identity

npx machina-cli add skill WesleySmits/agent-skills/brand-identity-template --openclaw

Files (1)

SKILL.md

2.0 KB

Brand Identity & Guidelines

📋 TEMPLATE SKILL This is a starter template. Copy this folder to your project and customize the resources files with your brand's specific guidelines, design tokens, and voice/tone documentation.

Setup Instructions

Copy this entire brand-identity-template folder to your project's .agent/skills/ directory
Rename the folder to brand-identity
Update the resources files with your brand specifics:
- resources/design-tokens.json - Your colors, fonts, spacing
- resources/tech-stack.md - Your technology choices
- resources/voice-tone.md - Your brand voice and tone
Replace [YOUR BRAND NAME] below with your actual brand name

Brand Name: [YOUR BRAND NAME]

This skill defines the core constraints for visual design and technical implementation for the brand. You must adhere to these guidelines strictly to maintain consistency.

Reference Documentation

Depending on the task you are performing, consult the specific resource files below. Do not guess brand elements; always read the corresponding file.

For Visual Design & UI Styling

If you need exact colors, fonts, border radii, or spacing values, read: 👉 resources/design-tokens.json

For Coding & Component Implementation

If you are generating code, choosing libraries, or structuring UI components, read the technical constraints here: 👉 resources/tech-stack.md

For Copywriting & Content Generation

If you are writing marketing copy, error messages, documentation, or user-facing text, read the persona guidelines here: 👉 resources/voice-tone.md

Source

git clone https://github.com/WesleySmits/agent-skills/blob/main/.agent/skills/brand-identity-template/SKILL.mdView on GitHub

Overview

This skill provides a starter template to centralize brand guidelines, design tokens, technology choices, and voice/tone. By customizing the template for your brand, teams ensure consistent visuals and messaging across UI, code, and copy.

How This Skill Works

Copy the brand-identity-template into your project, rename it to brand-identity, and populate resources/design-tokens.json, resources/tech-stack.md, and resources/voice-tone.md with your brand specifics. Replace the [YOUR BRAND NAME] placeholder and reference these resources whenever you generate UI components, style applications, or write user-facing copy to maintain brand consistency.

When to Use It

When generating UI components that must align with brand tokens (colors, typography, spacing).
When styling applications to follow the design system and tech constraints.
When writing marketing copy, UX copy, error messages, or documentation in brand voice.
When creating user-facing assets (landing pages, docs, help guides) that require consistent visuals and messaging.
When onboarding new team members or integrating tools to ensure everyone uses the single source of truth.

Quick Start

Step 1: Copy the entire brand-identity-template folder to your project’s .agent/skills directory and rename it to brand-identity.
Step 2: Update resources/design-tokens.json, resources/tech-stack.md, and resources/voice-tone.md with your brand specifics.
Step 3: Replace [YOUR BRAND NAME] with your actual brand name and reference these resources for all UI, code, and copy tasks.

Best Practices

Start by updating resources/design-tokens.json with your brand colors, fonts, and spacing values.
Replace [YOUR BRAND NAME] with your actual brand name across all docs.
Do not guess brand elements; always read and apply the specific resource files (design tokens, tech stack, voice tone).
Keep all brand constraints in version control and reference them in every output.
Treat the template as the single source of truth for UI, code, and copy to maintain consistency.

Example Use Cases

Re-skin a mobile app by applying design tokens from resources/design-tokens.json and aligning UI components to the brand tech stack.
Generate a component library where components pull colors, typography, and spacing from design-tokens.json and follow the tech choices in tech-stack.md.
Create copy for onboarding screens and help docs that follows the voice-tone guidelines in voice-tone.md.
Produce a marketing landing page and product docs that reflect the brand’s visuals and messaging constraints.
Onboard new developers with a starter kit that uses the single source of truth for design and content guidelines.

Frequently Asked Questions

Add this skill to your agents