gluestack-nativewind
CommunityEnforce Gluestack & NativeWind design patterns
AuthorCodySwannGT
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This skill ensures consistent, performant, and maintainable styling in React Native applications by enforcing Gluestack UI v3 and NativeWind v4 design patterns, reducing decision fatigue and limiting the solution space to canonical patterns.
Core Features & Use Cases
- Component Standardization: Replaces React Native primitives with Gluestack equivalents.
- Semantic Token Enforcement: Mandates the use of semantic color tokens over arbitrary values.
- Styling Pattern Adherence: Prevents inline styles, enforces spacing scales, and promotes variant-based styling with
tva. - Use Case: When developing new UI components or reviewing existing ones, this skill automatically flags and corrects any deviations from the established Gluestack and NativeWind design system, ensuring a cohesive and high-quality user interface.
Quick Start
Run the validation script to check the current directory for styling compliance.
Dependency Matrix
Required Modules
tva
Components
scriptsreferences
💻 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: gluestack-nativewind Download link: https://github.com/CodySwannGT/lisa/archive/main.zip#gluestack-nativewind Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.