skills.rest
gparker97
gparker97COMMUNITY
Explore all skills by this author →
WebsiteGitHub

beanies.family Brand Theme Skill

Enforce beanies.family brand guidelines for UI copy, components, colors, and assets.

4|2|Updated Feb 4, 2026
Search Tags:#typography#voice#assets#brand#design-system#color-palette#ui-guidelines
One-click install
npx skills add https://github.com/gparker97/beanies-family --skill beanies-family-brand-theme-skill
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: beanies.family Brand Theme Skill
Source: https://github.com/gparker97/beanies-family/tree/main/.claude/skills/beanies-theme
Command: npx skills add https://github.com/gparker97/beanies-family --skill beanies-family-brand-theme-skill

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Ensures all UI copy, component design, color usage, assets, and interaction patterns for beanies.family are consistent, accessible, and implementation-ready so teams avoid fragmented or conflicting design choices across the product.

Core Features & Use Cases

  • Color palette with exact hex values and tint rules for light and dark modes to standardize alerts, positive/negative values, and accent usage.
  • Typography scale, font-family rules, and typographic exceptions to ensure consistent sizing, weight, and accessibility across headings, body text, and financial figures.
  • Component and layout conventions including modal tiers, form wrappers, card and button styles, shadows, radii, and the attention-pulse behaviour for developers to implement reliably.
  • Asset and logo usage guidance with filename conventions, transparent vs opaque rules, spinner and celebration asset behavior, and clear-space/min-size constraints for designers and implementers.
  • Brand voice and copy standards with preferred phrasing, vocabulary, casing rules for dual-layer UI strings, and celebration/error messaging guidance for product writers and localization teams.

Quick Start

Use the beanies.family Brand Theme Skill to rewrite UI copy or to audit a component for adherence to the brand rules, applying the specified colors, typography, asset choices, and modal/component conventions.

Frequently Asked Questions about beanies.family Brand Theme Skill

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

FAQPage Schema
How do I enforce consistent brand voice and UI guidelines across multiple product implementations?▼

Brand voice and UI guidelines are enforced by applying standardized color hex values, typography scales, component radii, and modal tier rules across web and mobile implementations. This prevents fragmented design choices and ensures consistent, accessible product outputs.

What's the best way to standardize a color palette and typography scale for light and dark modes?▼

Standardize a color palette and typography scale by specifying exact hex values, tint rules for light and dark modes, and font-family weights for headings, body text, and financial figures. This ensures consistent accessibility and visual hierarchy across all product surfaces.

How do I audit UI components for adherence to a design system?▼

Audit UI components by checking their color selection, typography sizing, modal architecture, and asset filenames against documented design system rules. This validates that component styling, shadows, and interaction patterns like attention-pulse behavior meet established brand constraints.

Can I use brand theme rules to standardize asset filenames and logo clear-space constraints?▼

Brand theme rules standardize asset usage by specifying filename conventions, transparent versus opaque rules, and clear-space or minimum-size constraints for logos. This ensures designers and implementers maintain visual integrity across spinner and celebration assets.

Do I need specific modal tier rules to standardize component architecture in a design system?▼

Modal tier rules are required to standardize component architecture and interaction patterns. Specifying form wrappers, card styles, button behaviors, and shadow definitions allows developers to implement reliable and consistent frontend layouts across web and mobile contexts.

Why does inconsistent UI copywriting cause fragmented user experiences?▼

Inconsistent UI copywriting causes fragmented experiences when preferred phrasing, vocabulary, and casing rules for dual-layer strings are not documented. Applying brand voice standards ensures error messaging and celebration text remain clear and localized correctly.

Related Skills

Explore More Design & Creative Skills→
ZiadNagarZiadNagar

animation-systems

Define motion tokens, choreography patterns, and reduced-motion support for design systems.

Community
Advanced
marcioaltoemarcioaltoe
14

gesttione-design-system

Applies Gesttione brand colors, typography, and metric tokens to UI components.

Community
Intermediate
gsd-buildgsd-build
7.8k

make-interfaces-feel-better

Codify design-for-feel guidelines for surfaces, typography, motion, and interaction.

Official
Intermediate
elsolalelsolal
1

minimalist-ui

Define editorial UI design protocols with typography, color, and component specs.

Community
Advanced