CtrlK
BlogDocsLog inGet started
Tessl Logo

front-end-skill

Brief description of what this Skill does and when to use it (project)

52

1.09x

Quality

28%

Does it follow best practices?

Impact

91%

1.09x

Average score across 3 eval scenarios

SecuritybySnyk

Advisory

Suggest reviewing before use

Optimize this skill with Tessl

npx tessl skill review --optimize ./data/skills-md/0xgeorgemathew/splithub/front-end-skill/SKILL.md
SKILL.md
Quality
Evals
Security

Evaluation results

97%

7%

SplitHub Onboarding Screen Redesign

Typography and font loading

Criteria
Without context
With context

next/font/google import

100%

100%

Font loaded in layout

100%

100%

No banned fonts

100%

100%

Distinctive font choice

100%

100%

High-contrast pairing

100%

100%

Weight extremes

100%

100%

Size jump scale

100%

100%

design-notes explains pairing

100%

100%

No system font fallback as primary

100%

100%

Tailwind CSS styling

0%

70%

Without context: $0.3634 · 1m 35s · 22 turns · 28 in / 5,577 out tokens

With context: $0.4766 · 1m 57s · 24 turns · 279 in / 6,652 out tokens

89%

5%

Payment Confirmation Screen

Animation and NFC tap feedback

Criteria
Without context
With context

framer-motion used

100%

100%

Staggered entrance

91%

100%

NFC tap feedback animation

100%

100%

CSS transitions for hover/focus

0%

50%

High-impact focus

80%

100%

ANIMATION_NOTES mentions stagger

100%

100%

ANIMATION_NOTES mentions hover handling

100%

100%

Tailwind CSS styling

100%

25%

TypeScript props typed

100%

100%

No scattered micro-interactions

70%

100%

Without context: $0.4301 · 1m 54s · 22 turns · 140 in / 7,258 out tokens

With context: $0.6061 · 2m 47s · 23 turns · 278 in / 10,554 out tokens

88%

12%

SplitHub Dashboard Home Page

Color theming and atmospheric backgrounds

Criteria
Without context
With context

CSS variables for theme

25%

83%

Dark theme applied

100%

100%

No purple-on-white

100%

100%

Dominant color with sharp accent

100%

100%

Atmospheric background

100%

100%

No solid-only background

100%

100%

DESIGN_DECISIONS explains palette

100%

100%

DESIGN_DECISIONS explains background depth

100%

100%

DESIGN_DECISIONS explains CSS variable usage

62%

100%

Tailwind CSS styling

0%

25%

Mobile-first layout

50%

50%

Without context: $0.3891 · 2m 14s · 15 turns · 56 in / 8,848 out tokens

With context: $0.6873 · 3m · 29 turns · 67 in / 11,394 out tokens

Repository
NeverSight/skills_feed
Evaluated
Agent
Claude Code
Model
Claude Sonnet 4.6

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.