Name: expo-tailwind-setup
Rating: 71.2 (1 reviews)
Author: expo

Blog Docs Log in Get started

expo-tailwind-setup

Set up Tailwind CSS v4 in Expo with react-native-css and NativeWind v5 for universal styling

4.54x

Quality

56%

Does it follow best practices?

Impact

100%

4.54x

Average score across 3 eval scenarios

Securityby

Passed

No known issues

Optimize this skill with Tessl

npx tessl skill review --optimize ./plugins/expo/skills/expo-tailwind-setup/SKILL.md

Quality

Discovery

54%

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

The description benefits from highly specific technology names that serve as excellent trigger terms and create a distinct niche. However, it reads as a single setup action without a 'Use when...' clause, which significantly hurts completeness. Adding explicit trigger guidance and expanding the list of concrete actions would substantially improve this description.

Suggestions

Add a 'Use when...' clause, e.g., 'Use when the user wants to configure Tailwind CSS, NativeWind, or react-native-css in an Expo project, or asks about universal styling for React Native.'

List additional concrete actions beyond 'set up', such as 'configure PostCSS, resolve NativeWind compatibility issues, add Tailwind utility classes to React Native components'.

Dimension	Reasoning	Score
Specificity	Names the domain (Tailwind CSS v4 in Expo) and a general action ('Set up'), but only describes one action rather than listing multiple concrete capabilities like configuration steps, troubleshooting, or specific setup tasks.	2 / 3
Completeness	Describes 'what' (set up Tailwind CSS v4 in Expo) but completely lacks a 'Use when...' clause or any explicit trigger guidance for when Claude should select this skill. Per rubric guidelines, missing 'Use when' caps completeness at 2, and the 'what' is also thin, warranting a 1.	1 / 3
Trigger Term Quality	Includes highly specific and natural trigger terms users would actually say: 'Tailwind CSS v4', 'Expo', 'react-native-css', 'NativeWind v5', 'universal styling'. These are the exact technology names a developer would mention when needing this skill.	3 / 3
Distinctiveness Conflict Risk	Highly distinctive due to the very specific technology stack combination (Tailwind CSS v4 + Expo + react-native-css + NativeWind v5). This is unlikely to conflict with other skills given the narrow, well-defined niche.	3 / 3
	Total	9 / 12 Passed

Implementation

57%

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The skill excels at actionability with complete, executable code examples and specific package versions, making it highly practical for setup. However, it suffers from being a monolithic document that inlines extensive component code and CSS that should be split into referenced files. Adding explicit validation steps (e.g., confirming the setup works after each major phase) and restructuring with progressive disclosure would significantly improve it.

Suggestions

Split the component wrappers (tw/index.tsx, tw/image.tsx, tw/animated.tsx) and Apple System Colors CSS into separate referenced files, keeping only the quick-start essentials in SKILL.md

Add explicit validation checkpoints: after installation ('npx expo start should launch without errors'), after config ('verify styles apply to a test component'), and after component wrapper creation

Remove the Overview section — Claude doesn't need to be told what Tailwind CSS or PostCSS are

Add a concise numbered workflow summary at the top (1. Install → 2. Configure Metro → 3. Configure PostCSS → 4. Create global CSS → 5. Create component wrappers → 6. Verify) before diving into details

Dimension	Reasoning	Score
Conciseness	The skill is mostly efficient with concrete code examples, but includes some unnecessary explanations (e.g., the Overview section listing what each tool is, explaining 'Modern CSS-first configuration'). The Apple System Colors section is very lengthy and could be split to a separate reference file. Some comments in code are redundant.	2 / 3
Actionability	Excellent actionability with fully executable code throughout — install commands, complete configuration files, full component implementations, and usage examples. Everything is copy-paste ready with specific package versions and concrete file paths.	3 / 3
Workflow Clarity	The setup steps are implicitly sequenced (install → configure → create components → use) but there are no explicit validation checkpoints. There's no step to verify the setup works (e.g., 'run npx expo start and confirm styles render'). The troubleshooting section partially compensates but doesn't constitute a proper feedback loop.	2 / 3
Progressive Disclosure	This is a monolithic wall of content — over 300 lines with no references to external files. The Apple System Colors section, the full component wrapper implementations, and the animated components could all be split into separate reference files. Everything is inlined, making it hard to navigate and consuming excessive context window.	1 / 3
	Total	8 / 12 Passed

Validation

90%

Warnings & errors only

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 10 / 11 Passed

Validation for skill structure

Criteria	Description	Result
frontmatter_unknown_keys	Unknown frontmatter key(s) found; consider removing or moving to metadata	Warning

	Total	10 / 11 Passed

Repository: expo/skills
Commit: edc2afb

Reviewed: 5 days ago

Table of Contents

Discovery Implementation Validation

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.