Define dark design-system tokens for data visualizations, editorial layouts, and presentations.
npx skills add https://github.com/cerico/macfair --skill design-nico
Please help me install this Agent Skill. Skill: design:nico Source: https://github.com/cerico/macfair/tree/main/files/claude/skills/design/nico Command: npx skills add https://github.com/cerico/macfair --skill design-nico
The Nico Design System provides a cohesive framework to apply a refined, dark, desaturated aesthetic across data visualizations, editorial layouts, and presentations, reducing design drift and speeding up delivery.
Apply the color and typography tokens to your project, set a dark background, load a serif for headings, and implement circular motifs in data visualizations.
High-intent search queries and answers about installing and using this skill.
A dark-mode design system for data visualization provides a cohesive framework of color tokens, typography, and layout rules to maintain visual consistency across data-driven projects. It enforces a disciplined, desaturated palette tuned for contrast on dark surfaces to prevent design drift.
To apply editorial typography and color tokens to a dashboard, set a dark background, load a serif font for headings, use a system sans for secondary text, and implement circular motifs. This establishes clear hierarchy and spatial rhythm for data visualizations.
Yes, you can use this design system framework with any frontend library. It stays completely framework-agnostic, providing implementation notes, typography tokens, and spatial rhythm guidelines that you can apply directly to your editorial layouts.
The best way to standardize dark-mode data visualizations is to enforce a defined color palette, typography tokens, and clear implementation notes. Applying a cohesive framework reduces design drift and speeds up delivery for editorial layouts.
No, this dark-mode design system does not require any specific UI dependencies. It operates without external components, supplying only the foundational color tokens, typography hierarchy, and visual motif guidelines needed for your layouts.
You use a desaturated color palette for dark-mode editorial layouts to ensure visual clarity and reduce eye strain. The disciplined tokens are specifically tuned for contrast on dark surfaces, maintaining a sophisticated look for data dashboards.
FutureAtomsProvide high-contrast serif font pairings and React Native implementation examples.
Timmy00125Translate frontend requirements into Tailwind CSS and Next.js UI components.
OpenCovenGuide chart type selection and dashboard design for accessible React visualizations.
systempromptioEnforce branded visual design consistency using OKLCH tokens and fluid typography.
