skills.rest
spuneiartur
spuneiarturCOMMUNITY
Explore all skills by this author →
GitHub

brand-guidelines

Apply Anthropic brand colors, typography, and CSS variables to design artifacts.

1|Updated Mar 21, 2026
Search Tags:#typography#branding#tailwind#brand#design-system#css-variables
One-click install
npx skills add https://github.com/spuneiartur/claude-agent-specs --skill brand-guidelines-spuneiartur
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: brand-guidelines
Source: https://github.com/spuneiartur/claude-agent-specs/tree/main/next-js/skills/skills/brand-guidelines
Command: npx skills add https://github.com/spuneiartur/claude-agent-specs --skill brand-guidelines-spuneiartur

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill ensures consistent Anthropic branding across artifacts by applying the official colors, typography, and styling guidelines.

Core Features & Use Cases

  • Color tokens and typography rules to enforce visual identity across documents, apps, and marketing materials
  • CSS variables and Tailwind configuration guidance to implement the brand in Next.js projects
  • Use Case: Apply brand guidelines to marketing landing pages, design systems, and internal docs to maintain consistency

Quick Start

Apply Anthropic branding guidelines to a design artifact by exporting the CSS variables, typography rules, and font assets.

Frequently Asked Questions about brand-guidelines

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

FAQPage Schema
How do I apply Anthropic brand guidelines to a Next.js project?▼

To apply Anthropic brand guidelines, use the provided color tokens, typography rules, and CSS variables to configure your Next.js project. This ensures visual identity consistency across documents, apps, and marketing materials.

What are the official Anthropic brand color tokens and typography rules?▼

The official brand guidelines define specific color tokens and typography rules that enforce visual identity. They provide standardized font assets and design system variables for maintaining consistent branding across web assets.

Can I use Tailwind to configure Anthropic branding in my design system?▼

Yes, you can use Tailwind to configure Anthropic branding by utilizing the provided Tailwind configuration guidance. This allows you to map official color tokens and typography rules directly into your design system.

How do I export CSS variables for Anthropic brand styling?▼

You export CSS variables for Anthropic brand styling by applying the defined color tokens, typography rules, and font assets to your design artifacts. This generates the necessary config outputs for implementation.

Do I need a specific SKILL.md frontmatter to implement brand design systems?▼

Yes, implementing the brand design system requires a valid SKILL.md frontmatter containing the name and description. This defines the tokens, fonts, and config guidance needed for proper execution.

Related Skills

Explore More Design & Creative Skills→
AlejandroFiginiAlejandroFigini

ckm:brand

Embed brand voice, visual identity, and messaging guidelines into content prompts.

Community
Advanced
spuneiarturspuneiartur
1

theme-factory

Apply predefined color and font themes to slides, docs, and web pages.

Community
Intermediate
EstomEstom

brand-guidelines

Apply Anthropic brand colors, typography, and layout to documents and assets.

Community
Advanced
csim-sgcsim-sg

tailwindcss-advanced-design-systems

Build scalable Tailwind CSS design systems with design tokens and @theme configuration.

Community
Advanced