CtrlK
BlogDocsLog inGet started
Tessl Logo

core-components

Core component library and design system patterns. Use when building UI, using design tokens, or working with the component library.

54

Quality

61%

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/core-components/SKILL.md

The canonical home for this skill is core-components in administrakt0r/AI-Agents-Safe-Coding-Skills

SKILL.md
Quality
Evals
Security

Quality

Content

57%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 a solid, example-driven reference with concrete TSX snippets and token tables, but it is held back by redundant anti-pattern repetition, a vague 'When to Use' filler line, and a monolithic structure with no progressive disclosure into bundle files.

Suggestions

Remove the redundant Anti-Patterns section (it restates the CORRECT/WRONG token and raw-component examples already shown under Design Tokens) or consolidate it into one place.

Replace the filler 'When to Use' line with concrete gating guidance, e.g. specific scenarios where core components apply and when to fall back to raw primitives.

Split the bulk reference material (full token tables, per-component prop APIs) into references/ files and link to them one level deep from SKILL.md to improve navigation and token economy.

DimensionReasoningScore

Conciseness

The body is mostly token tables and code with little prose, but the Anti-Patterns section repeats the CORRECT/WRONG token and raw-component examples already shown in the Design Tokens section, and the closing 'When to Use' line ('applicable to execute the workflow or actions described in the overview') is vague padding.

3 / 5

Actionability

It provides concrete, copy-pasteable TSX examples for each primitive (Box, HStack/VStack, Text, Button, Input, Card) plus token value tables, with only minor gaps (no full prop API per component and import paths shown just once).

4 / 5

Workflow Clarity

This is a reference/patterns catalog rather than a sequenced workflow; the layout patterns show structure but there is no explicit multi-step sequence or checkpoints, and the 'When to Use' section is filler rather than guidance.

3 / 5

Progressive Disclosure

The file is well-sectioned (~270 lines) but everything is inlined into one monolithic SKILL.md with no bundle files in references/scripts/assets; the full token tables and per-component API reference could live in separate one-level-deep files, and the only cross-references are sibling-skill names rather than navigable file links.

3 / 5

Total

13

/

20

Passed

Description

66%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 functional: it states the domain and includes an explicit 'Use when' trigger with natural keywords. It is held back by slightly generic/circular actions and meaningful overlap risk with sibling UI skills.

Suggestions

Replace the circular 'working with the component library' with concrete actions like 'composing screens from Box/HStack/VStack, applying spacing/color/typography tokens, and building forms with Input and Button'.

Tighten the 'Use when' clause with more specific triggers, e.g. 'Use when building UI with the core component library, applying design tokens, or replacing raw platform components with Box/Text/Button.'

Differentiate from sibling skills by naming what is unique to this one (the token system and core primitives) versus react-ui-patterns/testing/storybook.

DimensionReasoningScore

Specificity

The description names the domain ('Core component library and design system patterns') and lists a few actions ('building UI', 'using design tokens', 'working with the component library'), but 'working with the component library' is circular and the actions remain high-level rather than comprehensive concrete operations.

3 / 5

Completeness

It includes an explicit 'Use when...' clause and states what the skill covers, so both what and when are present; the 'when' triggers are reasonably explicit but could be more concrete, matching the 'both present but when could be more specific' anchor rather than the fully concrete 5.

4 / 5

Trigger Term Quality

It surfaces natural terms users would say ('building UI', 'design tokens', 'component library', 'design system') with good coverage, though a few common synonyms or related phrases are missing.

4 / 5

Distinctiveness Conflict Risk

'Core component library and design system patterns' is somewhat specific but overlaps with closely related UI skills (the body itself cross-references 'react-ui-patterns'), so it could still trigger for the wrong skill.

3 / 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.