skills.rest
mazin-musleh
mazin-muslehCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

nds-hgi-font-update

Fetch CDN CSS, rebuild the local SCSS icon map, and update the HGI font file.

14|8|Updated Aug 16, 2025
Search Tags:#cdn#design-system#scss#font-update#icon-font#web-font
One-click install
npx skills add https://github.com/mazin-musleh/NDS-vanilla --skill nds-hgi-font-update
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: nds-hgi-font-update
Source: https://github.com/mazin-musleh/NDS-vanilla/tree/main/.claude/skills/nds-hgi-font-update
Command: npx skills add https://github.com/mazin-musleh/NDS-vanilla --skill nds-hgi-font-update

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Keeps the local HGI icon font in sync with the latest CDN release, ensuring glyphs are up-to-date and rendering remains consistent across projects.

Core Features & Use Cases

  • Fetch CDN CSS and parse icon mappings to rebuild the local SCSS for the icon set.
  • Update the local font-face mapping and ensure the font file matches the CDN glyphs.
  • Use Case: When HugeIcons publishes new icons or fixes glyphs, run this skill to update assets and avoid drift in the UI.

Quick Start

Fetch the CDN CSS, rebuild the local icon map, and update the font file to apply the latest glyphs.

Frequently Asked Questions about nds-hgi-font-update

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I update my local icon font from a CDN?▼

To update a local icon font from a CDN, fetch the CDN CSS, parse the icon mappings, and rebuild the local SCSS file. This ensures your local glyphs match the latest remote release and prevents UI drift.

Why do my web font icons render inconsistently after a CDN update?▼

Inconsistent web font rendering happens when local icon mappings drift from the updated CDN glyphs. Comparing old and new CDN CSS mappings and updating the local font file resolves cross-origin issues and ensures consistent rendering.

How do I rebuild an icon class map in SCSS after fetching new glyphs?▼

Rebuilding an icon class map in SCSS involves fetching the latest CDN CSS, comparing old and new icon mappings, and updating the local SCSS file. This maps the updated font file to the correct class names.

Does updating an icon font from a CDN require any external dependencies?▼

Updating an icon font from a CDN requires no external dependencies. The process fetches the CDN CSS, updates the local SCSS file, and downloads the updated font file directly within your existing design system.

What is the best way to sync HugeIcons with a local design system?▼

The best way to sync HugeIcons with a local design system is fetching the CDN CSS, comparing old and new icon mappings, and updating the local SCSS and font files. This reduces CDN-related cross-origin issues and maintains consistent rendering.

Related Skills

Explore More Design & Creative Skills→
baselakkad585-makerbaselakkad585-maker

web-design-guidelines

Fetches latest Web Interface Guidelines and verifies compliance of user files, outputting findings as file:line format.

Community
Intermediate
KorCaptainKorCaptain
1

cst-ui-system

Codify UI sizing, layering, and tooltip rules for CaptainSkillTree visuals.

Community
Intermediate
michalstanieckomichalstaniecko

frontend-design

Standardize SCSS, Tailwind, and Bootstrap styling for WordPress themes.

Community
Intermediate
anyprotoanyproto
8.6k

dark-mode-check

Audit SCSS and TSX files for hardcoded colors and missing dark-mode variants.

Official
Intermediate