Can I use this for non-web projects?

While optimized for CSS and web artifacts, the specific hex codes and font guidelines can be applied to any visual output Claude generates.

Does this skill handle dark and light modes?

Yes, it includes smart color selection that adjusts text and accent colors based on the background for optimal readability and accessibility.

What are the primary accent colors included?

The skill incorporates Anthropic’s official Orange (#d97757), Blue (#6a9bcc), and Green (#788c5d) accents for non-text elements.

What typography does this skill use?

It uses Poppins for headings (with Arial fallback) and Lora for body text (with Georgia fallback) to match Anthropic’s official style.

How do I trigger this brand styling?

Use it when you need to apply brand-specific colors, visual formatting, or company design standards to your code or visual artifacts.

Anthropic Brand Styling

Name: Anthropic Brand Styling
Author: GeObts

byGeObts

•

设计工具

Applies Anthropic’s official design system, typography, and color palette to code artifacts and visual components.

This skill enables Claude to automatically apply Anthropic's specific brand guidelines to any digital artifact, including web components, documentation, and UI mockups. By integrating the official color palette (such as Anthropic Dark and Orange) and typography (Poppins and Lora), it ensures visual consistency and professional design standards for developers building tools within or inspired by the Anthropic ecosystem.

主要功能

01Automated Anthropic color palette application using hex codes

022 GitHub stars

03Preservation of existing text hierarchy and formatting

04Official typography integration for headings and body text

05Dynamic background-aware text color selection for accessibility

06Consistent shape and accent styling using primary brand colors

使用场景

01Creating professional documentation with cohesive visual formatting

02Designing landing pages or dashboards that match Anthropic's aesthetic

03Styling React or HTML components with brand-compliant CSS

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add geobts/filecoin-agent-reputation brand-guidelines

For use in Claude.ai and ChatGPT

主要功能

01Automated Anthropic color palette application using hex codes

022 GitHub stars

03Preservation of existing text hierarchy and formatting

04Official typography integration for headings and body text

05Dynamic background-aware text color selection for accessibility

06Consistent shape and accent styling using primary brand colors

使用场景

01Creating professional documentation with cohesive visual formatting

02Designing landing pages or dashboards that match Anthropic's aesthetic

03Styling React or HTML components with brand-compliant CSS

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add geobts/filecoin-agent-reputation brand-guidelines

For use in Claude.ai and ChatGPT