Skip to content
cccskills
FreePublished on GitHub

zt-design-typography

Responsive Persian typography: production-level fluid type, glyph coverage, line height. Use when implementing, reviewing or testing responsive persian typography for React, Vite, Next.js or Perfect_AI projects.

The English summary is being prepared. Showing the original description.

Run score Not tested

See how to install

Files included (1)

  • SKILL.md2.0 KB

SKILL.md (original)

Review the instructions the agent will receive before you install.

Responsive Persian typography

When to activate

Use on tasks involving fluid type, glyph coverage, line height. For unrelated backend tasks do not load this skill.

Implementation sequence

  1. Write a design intent brief describing emotion, audience, trust requirement, content density, language and device.
  2. Select structured palette: background/surface/foreground/secondary/accent/semantic/focus/chart.
  3. Prefer OKLCH for ramp design, then gamut map to sRGB and compute WCAG contrast using linear sRGB.
  4. Reject palette if body/foreground contrast fails, or if hue is sole meaning encoder; check all interaction states.
  5. Ship CSS tokens, Figma-equivalent definitions, usage restrictions and screenshots in light/dark.

Task-specific requirements

  • Scope: fluid type, glyph coverage, line height. Design the full execution path, not a screenshot placeholder.
  • Identify dependency version and actual supported API signature; avoid inventing APIs.
  • Use original code, or install licensed upstream through its maintained tool if the user wants upstream code.
  • Choose measurable states, error handling, accessibility and performance budgets.

Implementation starter

Implementation notes: Model fluid type, glyph coverage, line height as explicit states, define input/output props and independent cleanup. Read master reference(s) below before writing code.

Evidence / acceptance

  • Document chosen semantic role palette and contrast table; fail visibly if accessibility thresholds are unmet.
  • Test common, edge, interrupted, accessibility and responsive states; provide concrete artifacts/evidence.

Deep references

  • ../perfect-ai-master/references/03-color-theory.md
  • ../perfect-ai-master/references/18-color-decision-engine.md
  • ../perfect-ai-master/references/19-design-matrix.md

Reviews

No reviews yet. Tell others what you thought.

Comments

No login needed. Share how it worked for you, ask a question, or note where it did not run.

No comments yet. Be the first to write one.

Comments are published right away. Do not include personal information such as email addresses or phone numbers. Up to 2 URLs.

0 / 1,000 characters

This form is protected by reCAPTCHA, and the Google Privacy Policy and Terms of Service apply.

More skills from this repository

Build, audit, and refactor premium Persian/English responsive websites and interactive 3D experiences with Anime.js v4, Three.js, motion choreography, color theory, RTL design systems, accessible UI/UX and VibeFarsi registry. Use for website design, animations, motion, landing pages, 3D/WebGL, responsive interfaces, visual quality, or Perfect_AI projects in Codex.

The English summary is being prepared. Showing the original description.

Realjustawall/Perfect-AI6Updated Oct 22, 2026

Accessibility automation: production-level axe audits and manual keyboard checks. Use when implementing, reviewing or testing accessibility automation for React, Vite, Next.js or Perfect_AI projects.

The English summary is being prepared. Showing the original description.

Realjustawall/Perfect-AI6Updated Oct 22, 2026

قواعد پروژه assistant for Codex; apply when building Persian/RTL web products, localizing content or integrating the related Iranian workflow. Local independent adaptation inspired by publicly documented VibeFarsi topics.

The English summary is being prepared. Showing the original description.

Realjustawall/Perfect-AI6Updated Oct 22, 2026

Easing mathematics: production-level cubic bezier, damped spring, velocity continuity. Use when implementing, reviewing or testing easing mathematics for React, Vite, Next.js or Perfect_AI projects.

The English summary is being prepared. Showing the original description.

Realjustawall/Perfect-AI6Updated Oct 22, 2026

Anime.js v4 core animations: production-level target selection, property keyframes, duration, ease, loop, play/pause. Use when implementing, reviewing or testing anime.js v4 core animations for React, Vite, Next.js or Perfect_AI projects.

The English summary is being prepared. Showing the original description.

Realjustawall/Perfect-AI6Updated Oct 22, 2026

Layout changes: production-level FLIP layout, additive composition, measurement. Use when implementing, reviewing or testing layout changes for React, Vite, Next.js or Perfect_AI projects.

The English summary is being prepared. Showing the original description.

Realjustawall/Perfect-AI6Updated Oct 22, 2026

See all skills by Realjustawall

Report a problem with this skill