Topic · Frontend & Design
Best theming and dark mode skills for Claude Code, Codex and other agents.
- skills
- 351
- official
- 9
Theming and dark mode skills, ranked
Ranked by score. Sort bymost stars,trending,newest,recently updated
| # | Skill | Repository | Stars | Used in | Tokens | Auto-check | Licence | Updated |
|---|---|---|---|---|---|---|---|---|
| 1 | A skill your agent uses when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise improve a… | bestofjs/ | 3.1k | 27 repos | ~2.6k | Automated safety check: Pass | MIT | 2 days ago |
| 2 | Builds or updates a design system in Figma from a codebase in ordered phases: discovery, variables and tokens, components, theming and documentation, with checkpoints. | warpdotdev/ | 65k | 2 repos | ~4.4k | Automated safety check: Pass | AGPL-3.0 | today |
| 3 | Always invoke when the user's message includes 'tailwind' in any form. | anonaddy/ | 4.9k | 10 repos | ~865 | Automated safety check: Pass | MIT | yesterday |
| 4 | Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs. | Ohh-889/ | 795 | 13 repos | ~2.5k | Automated safety check: Pass | MIT | 1 mo ago |
| 5 | A skill your agent uses for Laravel MCP development. An agent skill from coollabsio/coolify. | coollabsio/ | 63k | 1 repo | ~949 | Automated safety check: Pass | MIT | today |
| 6 | Builds responsive, accessible Chakra UI v3 components and layouts, sets up Chakra in new or existing projects, and designs themes with tokens, semantic tokens and recipes. | chakra-ui/ | 41k | — | ~3.1k | Automated safety check: Pass | MIT | today |
| 7 | UI/UX design intelligence for web and mobile. An agent skill from saoudi-h/solar-icons. | saoudi-h/ | 182 | 18 repos | ~11k | Automated safety check: Notes | Unknown | yesterday |
| 8 | Implement Google's Material Design 3 (Material You) UI system. | hamen/ | 1.5k | 2 repos | ~7.8k | Automated safety check: Pass | MIT | 2 mo ago |
| 9 | Applies one of ten preset color and font themes to slide decks, documents or HTML pages, or creates a new theme on the fly after you choose from a showcase. | anthropics/ | 180k | 47 repos | ~781 | Automated safety check: Pass | Apache-2.0 | 2 days ago |
| 10 | Scalar's design system — design tokens, theming (@scalar/themes), CSS variables, and the @scalar/components library. | scalar/ | 16k | — | ~2.7k | Automated safety check: Pass | MIT | today |
| 11 | Guides installing, configuring, styling and using taro-ui (At* components) in Taro apps for WeChat, Alipay, H5 and React Native. | jd-opensource/ | 4.7k | — | ~1.3k | Automated safety check: Pass | MIT | 12 days ago |
| 12 | 12.Create Docs Create complete documentation sites for projects. An agent skill from victorgarciaesgi/nuxt-typed-router. | victorgarciaesgi/ | 413 | 2 repos | ~2.8k | Automated safety check: Pass | MIT | yesterday |
| 13 | Implement Lottie animations using dotLottie runtimes (@lottiefiles/dotlottie-web and @lottiefiles/dotlottie-react). | LottieFiles/ | 892 | — | ~3.5k | Automated safety check: Pass | MIT | yesterday |
| 14 | Compose Multiplatform and Jetpack Compose patterns for KMP projects — state management, navigation, theming, performance, and platform-specific UI. | monta-app/ | 179 | 5 repos | ~2k | Automated safety check: Pass | Apache-2.0 | 6 days ago |
| 15 | Guides building Rust desktop apps with the gpui-kit crate, covering component selection, state ownership, theming and overlays, plus normative GPUI coding rules. | AprilNEA/ | 23k | — | ~5.5k | Automated safety check: Pass | Apache-2.0 | 3 days ago |
| 16 | Explains how to use the @pierre/theming package to list, resolve, select, switch and persist themes, with controller, color and React references. | pierrecomputer/ | 6.2k | — | ~661 | Automated safety check: Pass | Apache-2.0 | today |
| 17 | Rules for using daisyUI 5's semantic color names, such as primary and base-100, so interfaces stay readable across themes. | saadeghi/ | 43k | — | ~1.7k | Automated safety check: Pass | MIT | 7 days ago |
| 18 | Builds Marp slide decks in one of seven ready-made themes, using bundled templates plus syntax, image and style references to keep slides short and readable. | jjmartres/ | 133 | 3 repos | ~2.2k | Automated safety check: Pass | MIT | 5 mo ago |
| 19 | Design and improve user interfaces using the concrete rules from Refactoring UI (Wathan & Schoger) — constrained spacing/type/color/shadow scales, visual hierarchy through weight and color rather… | s0xDk/ | 584 | — | ~3.5k | Automated safety check: Pass | MIT | 1 mo ago |
| 20 | Implements an interface in one of two named color modes, iridescent white or colorful black, from a parameterized starter that reports measured color intensity. | sickn33/ | 47k | 1 repo | ~2.5k | Automated safety check: Pass | MIT | yesterday |
| 21 | Use when an app uses @pierre/trees to render or control a file tree, including React, vanilla JavaScript, SSR, web components, selection, search… | pierrecomputer/ | 6.2k | — | ~473 | Automated safety check: Pass | Apache-2.0 | today |
| 22 | Guidance for changing the Tabler framework's own JavaScript in core/js: the tabler.js and tabler-theme.js bundles, the Bootstrap port and their tests. | tabler/ | 42k | — | ~1.4k | Automated safety check: Pass | MIT | today |
| 23 | 23.Nuxt UI Build UIs with @nuxt/ui v4 — 125+ accessible Vue components with Tailwind CSS theming. | megaarmos/ | 141 | 1 repo | ~2.5k | Automated safety check: Pass | MIT | 6 mo ago |
| 24 | 24.Winui App Bootstrap, develop, and design modern WinUI 3 desktop applications with C and the Windows App SDK using official Microsoft guidance, WinUI Gallery patterns, Windows App SDK samples, and… | LanceMcCarthy/ | 172 | 1 repo | ~2.8k | Automated safety check: Pass | Apache-2.0 | 5 days ago |
| 25 | Vue Material Component Framework. An agent skill from logue/vite-vuetify-ts-starter. | logue/ | 181 | 1 repo | ~1.9k | Automated safety check: Pass | MIT | 5 days ago |
| 26 | How to use the gpui-component UI library in GPUI applications, and the normative Design and Coding Guides that govern it. | feigeCode/ | 1.8k | — | ~2.2k | Automated safety check: Pass | Unknown | today |
| 27 | Rules for adding or changing styles in Tabler's core/scss framework: file placement, custom properties, dark mode, RTL, tests and build gates. | tabler/ | 42k | — | ~2k | Automated safety check: Pass | MIT | today |
| 28 | 28.Color Audit Audit a design system's color palette against measurable color-science disciplines — WCAG/APCA contrast of declared token pairs, perceptual (OKLCH) ramp uniformity, color-blindness safety of… | rome-os/ | 717 | — | ~2.7k | Automated safety check: Pass | MIT | today |
| 29 | Creates a Chamilo color theme with a logo from a website's branding or from a logo file's dominant colors, entirely through the Chamilo REST API. | chamilo/ | 1k | — | ~5.1k | Automated safety check: Pass | GPL-3.0 | today |
| 30 | A skill your agent uses when changing the Niri/Noctalia desktop, the Wayland session, input method (fcitx5), theming, fonts, or desktop autostart in this repo. | ryan4yin/ | 2.1k | — | ~2k | Automated safety check: Pass | MIT | today |
| 31 | 31.macOS Design Design and build native-feeling macOS application UIs. An agent skill from ceorkm/macos-design-skill. | ceorkm/ | 138 | 1 repo | ~779 | Automated safety check: Pass | No licence | 7 mo ago |
| 32 | 32.Ask Sonner Guide to Sonner, the React toast library — install and wire up the Toaster, pick the right toast() call, promise and loading toasts, updating, dismissing and persisting toasts, styling, theming and… | leepokai/ | 186 | 4 repos | ~1.8k | Automated safety check: Warn | MIT | today |
| 33 | Create Remotion videos using the Geist design system aesthetic. | Marve10s/ | 752 | — | ~1.4k | Automated safety check: Pass | MIT | today |
| 34 | Generates light and dark Preline theme CSS from a brand color or mood, previews it, and validates token coverage through bundled local scripts. | htmlstreamofficial/ | 6.5k | — | ~619 | Automated safety check: Warn | Unknown | 1 mo ago |
| 35 | Apply a reversible theme/skin to the WorkBuddy desktop app (Tencent AI office agent) via local Chromium DevTools Protocol (CDP) injection. | cdredfox/ | 196 | — | ~1.5k | Automated safety check: Pass | MIT | 2 mo ago |
| 36 | 36.Ant Design Decision guide for antd 6.x, Ant Design Pro 5/ProComponents, Ant Design X v2, and the offline @ant-design/cli. | kqcoxn/ | 408 | 1 repo | ~1.1k | Automated safety check: Pass | MIT | 2 days ago |
| 37 | 37.Compose UI Best practices for building UI with Jetpack Compose, focusing on state hoisting, detailed performance optimizations, and theming. | Moustachauve/ | 169 | 3 repos | ~676 | Automated safety check: Pass | Apache-2.0 | today |
| 38 | OKLCH color space and color usage for web projects. An agent skill from trycompai/crm. | trycompai/ | 11k | — | ~1.9k | Automated safety check: Pass | MIT | 26 days ago |
| 39 | 39.Qt Testing Capture and visually inspect FreeCCR's PySide6/Qt GUI widgets using screenshots. | toonoumi/ | 181 | — | ~1.3k | Automated safety check: Pass | AGPL-3.0 | today |
| 40 | Create, inspect, convert, apply, replace, verify, troubleshoot, update, publish, or restore reversible CodeDrobe themes for supported Chromium/Electron AI desktop apps, including OpenAI Codex… | CodeDrobe/ | 250 | — | ~1.8k | Automated safety check: Pass | Apache-2.0 | 1 mo ago |
| 41 | Set up Tailwind v4 + shadcn/ui themed UI with dark mode. An agent skill from jezweb/claude-skills. | jezweb/ | 1.1k | 1 repo | ~3.2k | Automated safety check: Pass | MIT | yesterday |
| 42 | Shows how to use @pierre/highlights for syntax-highlighted HTML or tokens, streaming and incremental tokenizing, and Zed-compatible themes with CSS variables. | pierrecomputer/ | 6.2k | — | ~409 | Automated safety check: Pass | Apache-2.0 | today |
| 43 | Covers OpenOlat's SASS theme architecture, CSS class conventions, DOM structure, and roughly 540 Java component renderers for styling work. | OpenOLAT/ | 446 | — | ~3.2k | Automated safety check: Pass | Unknown | yesterday |
| 44 | Lays out dense analytics or trading-terminal screens in banded sections with hand-drawn SVG charts, instead of a wall of identical stat cards. | plugin87/ | 1.5k | — | ~2.6k | Automated safety check: Pass | MIT | today |
| 45 | Guides designing, reviewing or implementing interfaces that follow Google's Material Design 3 system: semantic tokens, component states, adaptive layout and accessibility. | skydashnet/ | 130 | — | ~3k | Automated safety check: Pass | MIT | 6 days ago |
| 46 | 46.Vue Tui Terminal Vue UI development and review for @simonhe/vue-tui. | Simon-He95/ | 257 | — | ~1.2k | Automated safety check: Pass | MIT | 2 days ago |
| 47 | 47.Great Docs Generate documentation sites for Python packages with Great Docs. | pymc-labs/ | 132 | — | ~2.7k | Automated safety check: Pass | MIT | 4 days ago |
| 48 | Provides comprehensive Tailwind CSS utility-first styling patterns including responsive design, layout utilities, flexbox, grid, spacing, typography, colors, and modern CSS best practices. | ever-works/ | 158 | 3 repos | ~1.6k | Automated safety check: Notes | AGPL-3.0 | yesterday |
Questions, answered from the data.
What is the best theming and dark mode skill?
Impeccable from bestofjs/bestofjs ranks first of the 351 theming and dark mode skills listed here, with the highest score: its repository has 3.1k GitHub stars, 27 other GitHub owners carry a copy, its SKILL.md loads about 2.6k tokens and it passes the automated safety check with no findings. Next come Figma Design System Builder and Tailwindcss Development.
Which theming and dark mode skills are official?
9 of the 351 theming and dark mode skills are official, published by the vendor's own GitHub organization: Theme Factory, Frontend UI Dark TS, Maui Safe Area, Maui Theming, Tui Development and 4 more.
How are these skills ranked?
By Skill Navigator score, which combines the GitHub stars of the skill's repository (shared across that repo's skills and discounted for large collections), how many other GitHub owners carry a copy of the skill, and automated SKILL.md quality checks, minus penalties for safety-check warnings and for each further skill from the same repository. Skills that fail the safety check are not listed.
Explore related skills
Category
More topics in Frontend & Design
- Accessibility1,046
- Design systems858
- UI design489
- React components461
- Landing pages455
- Internationalization415
- Typography404
- Design tokens393
- CSS and styling357
- Frontend development337
- Web performance315
- State management295
- HTML artifacts275
- Responsive design272
- Static sites and blogs270
- UX design266
- Web animation and motion195
- Forms and validation189
- Design to code90
- Icons and illustration63