CtrlK
BlogDocsLog inGet started
Tessl Logo

design-system

Guide for using Sentry's layout and text primitives. Use when implementing UI components, layouts, or typography. Enforces use of core components over styled components.

62

Quality

72%

Does it follow best practices?

Impact

No eval scenarios have been run

SecuritybySnyk

Advisory

Suggest reviewing before use

Optimize this skill with Tessl

npx tessl skill review --optimize ./.agents/skills/design-system/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Discovery

67%

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 with a clear 'Use when' clause and reasonable domain specificity around Sentry's layout primitives. Its main weaknesses are the lack of concrete action verbs and specific component names, and somewhat generic trigger terms that could overlap with other UI-related skills. Adding specific primitive names and more natural trigger terms would strengthen it.

Suggestions

List specific primitives or components (e.g., 'Layout, Grid, Text, Heading components') to increase specificity and trigger term coverage.

Add more natural trigger terms users might use, such as 'spacing', 'font size', 'CSS', 'flex', or specific Sentry component names like 'Panel', 'TextBlock', etc.

DimensionReasoningScore

Specificity

Names the domain (Sentry's layout and text primitives) and mentions some actions (implementing UI components, layouts, typography, enforcing core components over styled components), but doesn't list specific concrete actions like which primitives, what layout patterns, or what text components are available.

2 / 3

Completeness

Clearly answers both 'what' (guide for using Sentry's layout and text primitives, enforces core components over styled components) and 'when' (use when implementing UI components, layouts, or typography) with an explicit 'Use when' clause.

3 / 3

Trigger Term Quality

Includes some relevant keywords like 'UI components', 'layouts', 'typography', 'styled components', and 'Sentry', but misses common variations users might say such as 'CSS', 'styling', 'grid', 'flex', 'spacing', 'font', or specific component names.

2 / 3

Distinctiveness Conflict Risk

The Sentry-specific context helps distinguish it, but 'UI components, layouts, or typography' is broad enough to potentially overlap with other UI/styling skills. The mention of 'core components over styled components' adds some distinctiveness but could still conflict with general CSS or component library skills.

2 / 3

Total

9

/

12

Passed

Implementation

77%

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

This is a well-crafted, highly actionable skill with excellent concrete examples showing both anti-patterns and correct usage for every component. Its main weakness is verbosity—the repeated emphasis on Container inheritance, the extensive inline prop listings, and the token reference section make it longer than necessary. The content would benefit from splitting reference material into separate files to reduce the main skill's token footprint.

Suggestions

Extract the Token Reference section into a separate TOKENS.md file and link to it, reducing the main skill's length by ~40 lines

Consolidate the repeated 'Plus ALL Container props' notes into a single prominent callout at the top of the Layout Primitives section rather than repeating it for Flex, Grid, and Stack

DimensionReasoningScore

Conciseness

The skill is fairly comprehensive but includes some redundancy—repeatedly stating that Flex/Grid/Stack extend Container and inherit all its props, and listing 'Plus ALL Container props' sections multiple times. The do/don't examples are useful but the sheer volume (300+ lines) could be tightened, especially since Claude can infer inheritance patterns.

2 / 3

Actionability

Every component has concrete, copy-paste-ready TSX examples with clear do/don't patterns. Import paths are specified, prop values are enumerated with exact token names, and the examples are executable rather than pseudocode.

3 / 3

Workflow Clarity

For a component usage skill (not a multi-step destructive process), the workflow is clear: check the checklist before creating styled components, use the appropriate primitive, and the abstraction creation workflow has an explicit confirmation step. The decision tree at the end provides a clear sequence for choosing the right component.

3 / 3

Progressive Disclosure

The skill references implementation files (e.g., container.tsx, flex.tsx) for complete prop lists, which is good progressive disclosure. However, the document itself is quite long and monolithic—the token reference section, info components, and general guidelines could potentially be split into separate files. No bundle files are provided to support this structure.

2 / 3

Total

10

/

12

Passed

Validation

100%

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

Validation11 / 11 Passed

Validation for skill structure

No warnings or errors.

Repository
getsentry/sentry
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.