CtrlK
BlogDocsLog inGet started
Tessl Logo

expo-tailwind-setup

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

60

Quality

70%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./plugins/AI-Agents-Safe-Coding-Skills-claude/skills/expo-tailwind-setup/SKILL.md

The canonical home for this skill is expo-tailwind-setup in administrakt0r/AI-Agents-Safe-Coding-Skills

SKILL.md
Quality
Evals
Security

Quality

Content

78%Weight 40%Scale 1-5

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

The content is highly actionable with complete, executable configuration and code, and is reasonably concise with a clear setup sequence. Its main weakness is progressive disclosure: large component implementations are inlined rather than split into reference files.

Suggestions

Move the full component wrappers (src/tw/index.tsx, image.tsx, animated.tsx) into reference files under references/ and link to them, keeping only the key example inline in SKILL.md.

Add an explicit verification checkpoint after configuration, e.g. 'Run `npx expo start` and confirm a className utility renders before proceeding to component wrappers.'

Trim the commented-out babel.config.js block to a one-line 'no babel config needed; remove any NativeWind babel preset' note to reduce token overhead.

DimensionReasoningScore

Conciseness

The body is mostly concrete config and code with minimal filler; only minor over-explanation (the commented-out babel block and a few editorial notes) could be trimmed, fitting anchor 4.

4 / 5

Actionability

Provides a pinned install command plus complete, copy-paste-ready Metro/PostCSS/CSS/TSX configurations and usage examples covering the common cases, matching anchor 5.

5 / 5

Workflow Clarity

Presents a clear ordered sequence (install, configure, wrap components, use) with a troubleshooting section for error recovery, but lacks an explicit 'verify Tailwind classes apply' checkpoint, so it sits at anchor 4 rather than 5.

4 / 5

Progressive Disclosure

Section headers are clear, but with no bundle files present, hundreds of lines of component-wrapper code that could live in separate reference files are inlined in SKILL.md, matching anchor 3 ('content that should be separate is inline').

3 / 5

Total

16

/

20

Passed

Description

61%Weight 40%Scale 1-5

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 is specific and distinctive about its toolchain but lacks explicit trigger guidance and only states a single action. Adding a 'Use when...' clause and naming the concrete setup actions would raise completeness and specificity.

Suggestions

Add an explicit trigger clause, e.g. 'Use when setting up Tailwind/NativeWind styling in an Expo app, or when the user mentions Tailwind, NativeWind, or react-native-css in Expo.'

List the concrete actions performed rather than only 'Set up', e.g. 'Configure Metro and PostCSS, add CSS component wrappers, and wire up platform-specific theme variables.'

Include a natural synonym or phrasing users might say (e.g. 'Tailwind in React Native', 'NativeWind setup') to broaden trigger coverage.

DimensionReasoningScore

Specificity

Names the concrete toolchain (Tailwind CSS v4, react-native-css, NativeWind v5) and the domain (Expo), but only offers a single action ('Set up') rather than several specific actions, matching anchor 3.

3 / 5

Completeness

Provides a clear 'what' (set up Tailwind/NativeWind for universal styling) but has no 'Use when...' or equivalent trigger guidance, so per the cap it cannot exceed 3.

3 / 5

Trigger Term Quality

Includes natural terms users would say ('Tailwind CSS', 'Expo', 'NativeWind') with good coverage; a few synonyms or phrasings are missing, so it fits anchor 4 rather than 5.

4 / 5

Distinctiveness Conflict Risk

The pinned stack (Tailwind v4 + NativeWind v5 + react-native-css in Expo) is a distinct niche with minimal conflict risk, though it could overlap with a more generic NativeWind/Expo-styling skill, fitting anchor 4.

4 / 5

Total

14

/

20

Passed

Validation

93%

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

Validation15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

15

/

16

Passed

Repository
administrakt0r/AI-Agents-Safe-Coding-Skills
Reviewed

Table of Contents

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.