styling-tenzir-ui

What problem does it solve?

Frontend developers often struggle to maintain design consistency across UI components, leading to fragmented user experiences and wasted time on style decisions. This Skill provides instant access to Tenzir's complete design system, ensuring every UI element adheres to brand guidelines without guesswork.

Core Features & Use Cases

• Comprehensive Design Tokens: Access precise specifications for colors, typography, spacing, shadows, and border radii, ensuring visual harmony.
• Component Blueprints: Get detailed styling and state specifications for common UI elements like buttons, inputs, tags, toasts, checkboxes, and more.
• CSS Custom Properties: Implement the design system effortlessly using predefined CSS variables, compatible with CSS and Tailwind.
• Use Case: You're building a new feature and need to implement a button, an input field, and a tag. Instead of guessing styles or searching through design files, you can use this Skill to instantly retrieve the exact CSS properties, sizes, and states for each component, ensuring pixel-perfect brand compliance.

Quick Start

Use the styling-tenzir-ui skill to get the CSS custom properties for Tenzir's primary blue color palette.