fix-nerd-fonts
Fixes corrupted or missing Nerd Font icons in source code.
Install
mkdir -p .claude/skills/fix-nerd-fonts && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/17151" && unzip -o skill.zip -d .claude/skills/fix-nerd-fonts && rm skill.zipInstalls to .claude/skills/fix-nerd-fonts
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
Verify and fix Nerd Font icons after editing files. Use whenever writing orKey capabilities
- →Verify the presence of Nerd Font icons in a file
- →Identify missing Nerd Font icons after file edits
- →Replace placeholder strings with correct Unicode characters for Nerd Font icons
- →Use appropriate Unicode escape syntax for different codepoint ranges
- →Convert raw Nerd Font bytes to Unicode escape syntax in source code
- →Add new Nerd Font icons to the project with proper verification and escape syntax
How it works
The skill provides Python scripts to verify and fix Nerd Font icons by checking for specific Unicode codepoints and replacing placeholders with the correct escape sequences.
Inputs & outputs
When to use fix-nerd-fonts
- →Restore icons in terminal UI
- →Check icon integrity
- →Fix character encoding
About this skill
Fix Nerd Fonts
Nerd Font icons use Unicode Private Use Area codepoints (U+E000-U+F8FF and U+F0000-U+10FFFF). The Write and Edit tools may silently strip or corrupt these characters. This skill ensures they survive every edit.
When This Skill Applies
After every Write or Edit to a file that contains Nerd Font icons. Currently the known files are:
| File | Icons |
|---|---|
tui/src/main.rs | nf-md-web (U+F059F), nf-fa-keyboard_o (U+F11C), nf-fa-user (U+F007) |
issues/0504-web-tui/README.md | nf-md-web (U+F059F), nf-fa-keyboard_o (U+F11C), nf-fa-user (U+F007), nf-md-refresh (U+F0450) |
Update this table when new files or icons are added.
The Problem
The Write and Edit tools transmit file content as text. Characters in the Private Use Area — especially Supplementary Private Use Area codepoints above U+FFFF — may be silently dropped, replaced with replacement characters, or truncated. The file saves without error, but the icons are gone.
This is invisible in diffs and code review because the missing character leaves no trace — just an empty string where the icon was.
Step 1: Verify Icons
After any edit, run the verification script:
python3 -c "
src = open('<file_path>').read()
icons = {
'nf-md-web (U+F059F)': '\U000F059F',
'nf-fa-keyboard_o (U+F11C)': '\uF11C',
'nf-fa-user (U+F007)': '\uF007',
'nf-md-refresh (U+F0450)': '\U000F0450',
}
for name, char in icons.items():
if char in src:
print(f' OK {name}')
else:
print(f' MISSING {name}')
"
Adjust the icon list to match what the file should contain.
Step 2: Fix Missing Icons
If any icon is missing, use the placeholder-and-replace pattern:
- In the Edit tool, use a unique ASCII placeholder string where the icon
should go (e.g.,
PLACEHOLDER_WEB,PLACEHOLDER_KEYBOARD). - Then run Python to replace the placeholder with the real Unicode character:
python3 -c "
src = open('<file_path>').read()
src = src.replace('PLACEHOLDER_WEB', '\U000F059F')
src = src.replace('PLACEHOLDER_KEYBOARD', '\uF11C')
src = src.replace('PLACEHOLDER_USER', '\uF007')
src = src.replace('PLACEHOLDER_REFRESH', '\U000F0450')
open('<file_path>', 'w').write(src)
"
Step 3: Verify Again
Re-run the verification script from Step 1 to confirm all icons are present.
Python Escape Syntax
Codepoints at or below U+FFFF use \uXXXX:
'\uF11C' # U+F11C (nf-fa-keyboard_o)
'\uF007' # U+F007 (nf-fa-user)
Codepoints above U+FFFF use \U00XXXXXX (8 hex digits, zero-padded):
'\U000F059F' # U+F059F (nf-md-web)
'\U000F0450' # U+F0450 (nf-md-refresh)
Using \uF059F for a codepoint above U+FFFF is wrong — Python interprets it
as \uF059 + literal F, producing a garbage character.
Rule: Always Use Unicode Escape Syntax in Source Code
NEVER embed raw Nerd Font bytes in source code. Always use the language's Unicode escape syntax. Raw UTF-8 bytes are silently corrupted by text editors, LLM tools, clipboard operations, and diff/patch workflows. Unicode escapes are pure ASCII and survive any tool chain.
| Language | Syntax | Example (U+F007) | Example (U+F059F) |
|---|---|---|---|
| Rust | \u{XXXX} | "\u{F007}" | "\u{F059F}" |
| Zig | \u{XXXX} | "\u{F007}" | "\u{F059F}" |
| Python | \uXXXX / \U00XXXXXX | '\uF007' | '\U000F059F' |
| C/C++ | \uXXXX / \UXXXXXXXX | u8"\uF007" | u8"\U000F059F" |
| Swift | \u{XXXX} | "\u{F007}" | "\u{F059F}" |
| JavaScript | \u{XXXX} | "\u{F007}" | "\u{F059F}" |
When editing a file that contains raw Nerd Font bytes, convert them to
Unicode escapes as part of the edit. Use xxd or python3 to identify the
codepoint, then replace the raw bytes with the appropriate escape.
Adding New Icons
When introducing a new Nerd Font icon to the project:
- Add the icon name, codepoint, and file to the table in this skill.
- Add it to the verification script's
iconsdict. - Add a placeholder constant for it.
- Use the placeholder-and-replace pattern for the first embed.
- Use Unicode escape syntax (
\u{...}in Rust/Zig, etc.) — never raw bytes.
When not to use it
- →When editing files that do not contain Nerd Font icons
- →When the issue is not related to Private Use Area character corruption
- →When the task is not about verifying or fixing icon integrity
Prerequisites
Limitations
- →Requires manual adjustment of the icon list in the verification script
- →Requires using unique ASCII placeholder strings for fixing missing icons
- →Relies on Python for verification and fixing scripts
How it compares
This method directly addresses the problem of text editor corruption of Private Use Area characters by using explicit Unicode escape syntax, ensuring icon integrity across toolchains.
Compared to similar skills
fix-nerd-fonts side by side with the closest alternatives in the catalog.
| Skill | Installs | Updated | Safety | Difficulty |
|---|---|---|---|---|
| fix-nerd-fonts (this skill) | 0 | 2mo | Review | Intermediate |
| frontend-design | 481 | 2mo | No flags | Advanced |
| screenshot-to-code | 204 | 2mo | No flags | Beginner |
| textual | 143 | 9mo | Review | Intermediate |
Try saying
Example prompts that trigger this skill in your AI assistant.
You might also like
frontend-design
anthropics
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
screenshot-to-code
OneWave-AI
Convert UI screenshots into working HTML/CSS/React/Vue code. Detects design patterns, components, and generates responsive layouts. Use this when users provide screenshots of websites, apps, or UI designs and want code implementation.
textual
KyleKing
Expert guidance for building TUI (Text User Interface) applications with the Textual framework. Invoke when user asks about Textual development, TUI apps, widgets, screens, CSS styling, reactive programming, or testing Textual applications.
web-artifacts-builder
anthropics
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.
radix-ui-design-system
sickn33
Build accessible design systems with Radix UI primitives. Headless component customization, theming strategies, and compound component patterns for production-grade UI libraries.
svelte-ui-design
XIYO
ALWAYS use this skill for ANY Svelte component styling, design, or UI work. Svelte 5 UI design system using Tailwind CSS 4, Skeleton Labs design tokens/presets/Tailwind Components, and Bits UI headless components. Covers class composition, color systems, interactive components, forms, overlays, and all visual design.