Does this skill support the latest Tamagui v4 configuration?

Yes, it includes specific patterns for @tamagui/config/v4, including shorthand property aliases and simplified theme creation.

How does this help with Tamagui compiler performance?

It provides patterns that avoid dynamic style breaks, ensuring your components can be statically extracted and flattened by the compiler.

Does it support compound components?

Yes, it details the use of createStyledContext and withStaticProperties to build cohesive APIs like Button and Button.Text.

Can I use this for React Native and Web projects?

Absolutely. The skill focuses on cross-platform styling, including the use of Adapt for switching between Dialogs on web and Sheets on mobile.

Tamagui Best Practices

Name: Tamagui Best Practices
Author: 0xBigBoss

by0xBigBoss

•

디자인 도구

Implements high-performance Tamagui patterns for v4 configuration, compiler optimization, and cross-platform UI systems.

This skill provides Claude with deep domain expertise for Tamagui, the cross-platform UI kit for React and React Native. It offers specialized guidance on setting up Config v4, utilizing createThemes for advanced design systems, and implementing compound components using createStyledContext. By following these patterns, developers can ensure their styles are fully optimized for the Tamagui compiler, maintain type safety across variants, and correctly handle platform-specific behaviors for complex components like Dialogs and Sheets.

주요 기능

01Advanced variant mapping with token spread operators

02Styleable wrapper implementation for variant inheritance

03Config v4 and createThemes architectural patterns

0428 GitHub stars

05Compiler-safe styling and performance anti-pattern detection

06Compound component creation using createStyledContext

사용 사례

01Implementing complex responsive overlays using the Adapt pattern

02Building a scalable, token-based design system for web and mobile

03Refactoring UI components to maximize Tamagui compiler optimization

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add 0xbigboss/claude-code tamagui-best-practices

For use in Claude.ai and ChatGPT

Download Skill