frontend-typography

When frontend text is being chosen, loaded, sized, wrapped, truncated, or reviewed for readable hierarchy, stable values, input behavior, or language and bidi…

Skill by bryan824

IndexedMIT

Write a review

Install

Works with Claude Code, Claude apps, Codex, Cursor, Gemini CLI, GitHub Copilot, VS Code, OpenCode, Goose, Windsurf. Read the repository before you give any tool access to your data.

npx agentmarket install skill/bryan824-frontend-typography

Asks which of your tools to add it to (Claude Code, Codex, Cursor, VS Code, Windsurf, Gemini CLI, Claude Desktop) and shows the change first. See https://agentmart.dev/cli.

Get the weekly diff

The weekly diff: one email a week with new agent tools, notable updates and grade changes, plus security alerts for tools you follow. Double opt-in, one-click unsubscribe.

About

When frontend text is being chosen, loaded, sized, wrapped, truncated, or reviewed for readable hierarchy, stable values, input behavior, or language and bidi rendering.

Use cases: design, frontend

Reviews

Write a review

No reviews yet. Installed it? Reviews come from verified installers only. How reviews work

Permissions

What this skill can do and what it asks for, from its SKILL.md. Checked Oct 25, 2026.

Tools: No tools found
Secrets: None asked for
Install scripts: None found

Network hosts it talks to 1

codeload.github.com · found in install command

Files it touches

~/.claude/skills/frontend-typography

What's inside

Skill name: frontend-typography
Description: When frontend text is being chosen, loaded, sized, wrapped, truncated, or reviewed for readable hierarchy, stable values, input behavior, or language and bidi rendering.
License: MIT
Instructions: 32 lines in SKILL.md · view on GitHub

Files (2)

REFERENCE.md
SKILL.md

SKILL.md (first lines)

# Frontend Typography

**Typography is controlled restraint.** Make reading and meaning stable before
making type expressive: each role earns its face, scale step, weight, and line
behavior.

- Choose and load only the font faces, styles, and weights the interface uses;
  retain a compatible fallback and avoid synthetic emphasis unless it is
  intentional. Build a small role-based scale whose visual hierarchy follows
  the content hierarchy.
- Tune line height and measure for the role, not a one-size rule. Decide whether
  each text lane wraps, breaks long tokens, or truncates; truncation of useful
  content needs a way to reach the full value.
- Stabilize changing money, counts, and IDs with tabular figures where supported.
  Inputs should inherit the intended type treatment, keep entered text legible,
  and never make a placeholder carry the label's job.
- Treat language as rendering input: set the appropriate `lang` and direction
  boundary, preserve digit order, isolate mixed-direction values when needed,
  and use punctuation and nonbreaking opportunities deliberately.
- Stress every text policy in narrow lanes with long localized names, money,
  IDs, and labels. `frontend-layout` keeps those lanes shrinkable and reachable;
  this skill keeps their text readable without overflow or accidental loss.

For selected edge cases, read [REFERENCE.md](REFERENCE.md).

When `frontend-design` is installed, use its
[shared review contract](../frontend-design/references/REVIEW.md). Otherwise report
focused typography findings, exact evidence, user impact and verification gaps
directly. Review-only requests stay read-only; do not install siblings or duplicate
the full review schema.

From bryan824/kirin-pi, MIT.

Signals

Stars: 0
Forks: 0
Open issues: 0
Last commit (this folder): Oct 1, 2026 (29 days ago)

From GitHub (fetched Oct 24, 2026).

Details

License: MIT
Repository: github.com/bryan824/kirin-pi
First seen: Oct 24, 2026
Last checked: Oct 24, 2026
Source: GitHub github-graphql

More from bryan824

Cite this page

frontend-typography skill. Agent Mart. https://agentmart.dev/skills/bryan824-frontend-typography (last updated 2026-10-24)