skills.rest
xinge-ji
xinge-jiCOMMUNITY
Explore all skills by this author →
GitHub

skyroc-admin-styling

Style Skyroc Admin with UnoCSS theme tokens and global styles.

Updated Feb 8, 2026
Search Tags:#design-system#theme-tokens#ant-design#global-styles#admin-styling#unoscss
One-click install
npx skills add https://github.com/xinge-ji/skyroc --skill skyroc-admin-styling
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: skyroc-admin-styling
Source: https://github.com/xinge-ji/skyroc/tree/main/.agents/skills/skyroc-admin-styling
Command: npx skills add https://github.com/xinge-ji/skyroc --skill skyroc-admin-styling

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps engineers and designers achieve consistent Skyroc Admin styling by guiding UnoCSS usage, theme token extension, and global styles integration to reduce visual drift and rework across the admin UI.

Core Features & Use Cases

  • Standardized UnoCSS usage and CSS best practices within Skyroc Admin.
  • Centralized theme token and global style strategy that ensures consistent branding across components.
  • Use Case: when implementing a global color or typography update, this Skill provides a clear workflow to apply changes safely while preserving accessibility.

Quick Start

Inspect admin/src/theme and uno.config.ts, then implement UnoCSS tokens and global styles across admin components, and verify changes with lint and typecheck.

Frequently Asked Questions about skyroc-admin-styling

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

FAQPage Schema
How do I style an admin dashboard using UnoCSS and theme tokens?▼

To style an admin dashboard with UnoCSS and theme tokens, inspect the admin/src/theme directory and uno.config.ts, then apply centralized design tokens and global styles across components to ensure visual consistency.

What is the best way to manage global styles and design tokens in an Ant Design admin panel?▼

The best way to manage global styles and design tokens in an Ant Design admin panel is to centralize them in admin/src/styles and admin/src/theme, extending tokens safely to preserve accessibility and enforce consistent UI theming.

How do I apply a global color or typography update safely across admin UI components?▼

To apply a global color or typography update safely, extend the centralized theme tokens in admin/src/theme and update admin/src/styles, then verify the changes across admin UI components using lint and typecheck to preserve accessibility.

Can I use UnoCSS for global theming without causing visual drift in admin components?▼

Yes, you can use UnoCSS for global theming without visual drift by standardizing UnoCSS usage and centralizing theme tokens in admin/src/theme, which enforces consistent branding and CSS best practices across all admin components.

Why does my admin styling break when extending theme tokens in UnoCSS?▼

Admin styling breaks when extending theme tokens if UnoCSS usage deviates from the centralized strategy in admin/src/styles, causing visual drift; running lint and typecheck after updating uno.config.ts helps catch and prevent these inconsistencies.

Related Skills

Explore More Software Engineering Skills→
PosteriotPosteriot

tailwind-migration-makalahapp

Migrate Makalahapp custom CSS to Tailwind CSS 4 utilities.

Community
Advanced
borgiusborgius
5

slidev-styling

Style Slidev decks with UnoCSS utilities and custom CSS.

Community
Advanced
Higashi-KotaHigashi-Kota

architecture-review

Audit design token architecture and generate a refactoring plan.

Community
Intermediate
shawn-sandyshawn-sandy

inline-style-to-class

Convert inline HTML and JSX styles into reusable CSS classes with variables.

Community
Advanced