What does this Claude Code Skill do?

This skill equips Claude with the complete Planted brand and design system. It provides detailed rules for creating on-brand UI components, visual layouts, and marketing copy that reflect Planted's unique 'challenger brand' voice.

When should I use this skill?

Use this skill anytime you're creating user-facing content for Planted. This includes designing new UI components, writing headlines, building web pages, or needing a specific color hex code or spacing value from the design system.

How does this skill improve my workflow?

It centralizes all brand and design knowledge, eliminating the need to hunt for guidelines. Claude can instantly generate code, copy, and design suggestions that are perfectly on-brand, dramatically speeding up development and ensuring consistency.

What specific capabilities does it provide?

The skill provides a complete visual design system (colors, typography, spacing), ready-to-use UI component patterns for buttons and cards, specific copywriting rules with a dual-mode tone, a list of forbidden corporate phrases, and built-in accessibility requirements.

Planted Brand & Design

Name: Planted Brand & Design
Author: cgjen-box

bycgjen-box

Herramientas de Diseño

Creates UI components, marketing copy, and visual layouts that embody the Planted challenger brand voice and detailed design system.

Acerca de

This skill codifies the complete brand identity for Planted, a company with a challenger brand voice inspired by Oatly. It provides comprehensive guidelines for both visual design and copywriting to ensure a consistent and distinctive user experience. The skill details a full design system, including a specific color palette, typography rules, spacing system, and component patterns. It also defines a unique brand voice that oscillates between scientific facts and playful humor, offering clear do's and don'ts for writing headlines, CTAs, and body copy. Use this skill when building new UI components, writing any customer-facing text, or making any design decisions for the Planted website to maintain brand integrity.

Características Principales

Provides a detailed visual design system with a specific color palette, typography scales, and 8-point spacing grid.
Defines a 'challenger brand' philosophy focused on a human, inconsistent, and entertaining voice.
Includes ready-to-use patterns for core UI elements like buttons and cards, with defined states and behaviors.
Outlines specific copywriting rules, a dual-mode tone (Scientific vs. Playful), and a list of forbidden corporate phrases.
Integrates accessibility requirements for color contrast, touch targets, and motion.
0 GitHub stars

Casos de Uso

Onboarding new designers and developers to the Planted brand standards.
Writing marketing copy for emails, social media, or advertisements.
Developing a new feature or page for the Planted website.

Acerca de

Características Principales

Provides a detailed visual design system with a specific color palette, typography scales, and 8-point spacing grid.
Defines a 'challenger brand' philosophy focused on a human, inconsistent, and entertaining voice.
Includes ready-to-use patterns for core UI elements like buttons and cards, with defined states and behaviors.
Outlines specific copywriting rules, a dual-mode tone (Scientific vs. Playful), and a list of forbidden corporate phrases.
Integrates accessibility requirements for color contrast, touch targets, and motion.
0 GitHub stars

Casos de Uso

Onboarding new designers and developers to the Planted brand standards.
Writing marketing copy for emails, social media, or advertisements.
Developing a new feature or page for the Planted website.