CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

satori

Expert guidance for Satori — Vercel's library that converts HTML and CSS to SVG, commonly used to generate dynamic OG images for Next.js and other frameworks.

59

Quality

74%

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/vercel/skills/satori/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

82%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 body is a strong, actionability-first reference: fully executable examples for every scenario, Satori-specific gotchas (no default fonts, flex-only layout, no grid), and clear section organization. Weakest spots are mild redundancy in the 'Key Patterns' section and the absence of any progressive-disclosure split despite the CSS reference list being a natural candidate for a separate file.

Suggestions

Trim the 'Key Patterns' section to points not already stated earlier (e.g. keep only the decision rules like 'use next/og in Next.js' and '1200×630 is standard') to reduce repetition.

Move the CSS supported/not-supported lists into a references/ file (e.g. references/css-support.md) and link to it, so the main file stays a lean overview and progressive disclosure improves.

Add a short 'Which approach should I use?' decision list near the top (Next.js convention file vs. route handler vs. standalone Satori) to make the workflow sequence explicit.

DimensionReasoningScore

Conciseness

The body is mostly dense, Satori-specific facts and executable code with no padding about concepts Claude already knows. Minor trimming is possible: 'Key Patterns' restates points already made ('display: flex everywhere', 'load fonts explicitly', '1200×630'), and the two Next.js sections overlap, which keeps it at anchor 4 rather than 5.

4 / 5

Actionability

Every section ships copy-paste-ready, executable code: install commands, a full edge route handler, a convention-based opengraph-image.tsx file, a standalone satori() call with font config, edge-runtime font fetching, URL parameter extraction, and img usage. This matches anchor 5 — fully executable examples covering the common cases.

5 / 5

Workflow Clarity

Content is organized by scenario (Next.js route → convention files → standalone) with an explicit decision rule ('Use next/og in Next.js projects'), and no destructive or batch operations exist so the validation cap does not apply. It sits below anchor 5 only because there is no explicit up-front 'pick your path' sequencing; the reader assembles the flow from section order.

4 / 5

Progressive Disclosure

The body references no bundle files (references/, scripts/, assets/ are absent) and everything is inline with well-signaled, well-organized sections plus one-level-deep external links under 'Official Resources'. It matches anchor 4 (good structure, minor organization gaps): the ~25-line CSS supported/not-supported reference list is the main content that could arguably live in a separate reference file, preventing a 5.

4 / 5

Total

17

/

20

Passed

Description

57%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 clearly identifies its niche with concrete library-specific language, but it reads more like a library synopsis than a skill description: it lacks any 'Use when...' trigger guidance and misses natural trigger variations such as 'Open Graph' or 'opengraph-image'. Distinctiveness is excellent because of the specific tool naming.

Suggestions

Add an explicit trigger clause, e.g. 'Use when generating OG/Open Graph images, working with opengraph-image.tsx or twitter-image.tsx routes, or using satori/@vercel/og/next/og'.

Include natural synonyms and file conventions users actually mention — 'Open Graph', 'social card', 'opengraph-image.tsx', 'twitter-image' — alongside 'OG images'.

Reframe one phrase around the skill's actions (e.g. 'Generate and debug dynamic OG images with Satori and @vercel/og') so the description states what the skill does, not only what the library does.

DimensionReasoningScore

Specificity

The description names the domain ('Satori', 'converts HTML and CSS to SVG') and 1-2 concrete actions ('generate dynamic OG images'), but frames these as what the library does rather than listing the skill's own specific actions, so coverage is not comprehensive. It is above anchor 2 because the actions named are concrete, but below anchor 4, which expects several specific actions with only minor gaps.

3 / 5

Completeness

The 'what' is clear (HTML/CSS to SVG for dynamic OG images), but there is no 'Use when...' clause or equivalent explicit trigger guidance — the when is only weakly implied by 'commonly used to generate dynamic OG images for Next.js'. Per the judging guidelines, a missing 'Use when...' clause caps completeness at 3.

3 / 5

Trigger Term Quality

Relevant keywords are present ('Satori', 'Vercel', 'OG images', 'Next.js', 'SVG'), but common natural variations users would say — 'Open Graph', 'opengraph-image', 'twitter image', 'social card' — are missing. This matches anchor 3 ('some relevant keywords but missing common variations or synonyms') rather than 4, which requires good coverage with only a few terms missing.

3 / 5

Distinctiveness Conflict Risk

The description names a clear niche ('Satori — Vercel's library', 'OG images') with distinct, specific triggers that would not plausibly fire for an unrelated skill. This matches the anchor-5 example's pattern of a clear niche with minimal conflict risk.

5 / 5

Total

14

/

20

Passed

Validation

87%

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

Validation — 14 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

metadata_version

'metadata.version' is missing

Warning

metadata_field

'metadata' should map string keys to string values

Warning

Total

14

/

16

Passed

Repository

openai/plugins

Path

plugins/vercel/skills/satori/SKILL.md

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.