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.

주요 기능

Advanced variant mapping with token spread operators
Styleable wrapper implementation for variant inheritance
Config v4 and createThemes architectural patterns
28 GitHub stars
Compiler-safe styling and performance anti-pattern detection
Compound component creation using createStyledContext

사용 사례

Implementing complex responsive overlays using the Adapt pattern
Building a scalable, token-based design system for web and mobile
Refactoring UI components to maximize Tamagui compiler optimization

소개

주요 기능

Advanced variant mapping with token spread operators
Styleable wrapper implementation for variant inheritance
Config v4 and createThemes architectural patterns
28 GitHub stars
Compiler-safe styling and performance anti-pattern detection
Compound component creation using createStyledContext

사용 사례

Implementing complex responsive overlays using the Adapt pattern
Building a scalable, token-based design system for web and mobile
Refactoring UI components to maximize Tamagui compiler optimization