apply-mantel-styles
CommunityBrand-consistent visuals for diagrams and components.
Authorsammcj
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill eliminates brand inconsistency in visual designs by providing comprehensive styling guidelines for diagrams and frontend components that align with Mantel's brand identity.
Core Features & Use Cases
- Mermaid Diagram Styling: Apply consistent brand colors and semantic styling to flowcharts, sequence diagrams, and system architectures.
- PlantUML Theme Integration: Configure complete brand themes for activity, class, sequence, and state diagrams.
- Frontend Component Guidelines: Implement brand-consistent buttons, navigation, forms, and alerts using CSS variables and Tailwind configs.
- Use Case: Imagine you need to create a system architecture diagram for a client presentation. Use this Skill to apply Mantel's Ocean, Flamingo, and Sky Blue colors with proper semantic meaning for different system components.
Quick Start
Use the apply-mantel-styles skill to create a Mermaid flowchart showing our user authentication process using the brand color palette.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: apply-mantel-styles Download link: https://github.com/sammcj/agentic-coding/archive/main.zip#apply-mantel-styles Please download this .zip file, extract it, and install it in the .claude/skills/ directory.