Apply myKaarma design tokens and layout rules to UI components.
npx skills add https://github.com/mykaarma/claude-sutras --skill brand-guidelines-mykaarma
Please help me install this Agent Skill. Skill: brand-guidelines Source: https://github.com/mykaarma/claude-sutras/tree/main/skills/brand-guidelines Command: npx skills add https://github.com/mykaarma/claude-sutras --skill brand-guidelines-mykaarma
Inconsistent visual design across UI components leads to brand dilution and user confusion. This Skill guarantees that every UI artifact follows the official myKaarma design system, ensuring color, typography, spacing, and interaction patterns are uniform in both light and dark modes.
Invoke the brand‑guidelines skill before starting a UI component to automatically apply the correct design tokens and layout rules.
High-intent search queries and answers about installing and using this skill.
Apply design tokens with inline hex fallbacks to UI components to enforce consistent brand styling and prevent broken themes in both light and dark modes. This approach ensures colors, shadows, and spacing reference centralized tokens while providing fallbacks if assets fail to load.
Use a Lato-based typography class system, card-based layouts, defined spacing scales, and navigation hierarchy when building dashboards and forms. These layout rules enforce visual uniformity and structural consistency across all user interface artifacts.
Yes, design token fallbacks prohibit pure black or white backgrounds in dark-mode by providing separate token sets for dark surfaces. This mechanism defines appropriate contrast levels and prevents harsh background rendering when primary assets fail to load.
Invoke brand guidelines before generating UI screens to automatically apply correct design tokens and layout rules. This ensures AI-generated interfaces maintain brand consistency for color, typography, and interaction patterns without manually copying token values.
Brand guidelines work for both component libraries and individual visual interfaces like dashboards and forms. It enforces token-based styling, typography, spacing, and color palettes uniformly across any UI project requiring brand consistency and dark-mode support.
JKKN-InstitutionsStandardize brand styling with Tailwind configuration and Next.js theme provider.
impact-initiativesDesign production-grade frontend interfaces with cohesive CSS and UI patterns.
joshua3403Create a platform-agnostic design system with token definitions and component scaffolding.
musher-devDefine color tokens, typography systems, and spatial rules for marketing pages.
