Agent skill

Daisyui Colors

by carverauto in carverauto/serviceradar

MANDATORY color usage rules for daisyUI 5. An agent skill from carverauto/serviceradar.

Apache-2.0Auto-check passedDevOps & Cloud

Install Daisyui Colors

skills CLI
$ npx skills add carverauto/serviceradar --skill daisyui-colors -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install carverauto/serviceradar daisyui-colors --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/carverauto/serviceradar.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/daisyui/colors .claude/skills/daisyui-colors && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
daisyui-colors
GitHub stars
921
Token cost
~1.4k tokens
SKILL.md length
451 words
Files
1
Skills in repo
18
Repo updated
First seen
Licence
Apache-2.0

At a glance

MANDATORY color usage rules for daisyUI 5. An agent skill from carverauto/serviceradar.

  • Works in 10 steps: daisyUI adds semantic color names to… → daisyUI color names can be used in… → daisyUI color names include variables as… → …
  • DevOps & Cloud work in your project
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Daisyui Colors is an agent skill from carverauto/serviceradar. MANDATORY color usage rules for daisyUI 5

Its SKILL.md is about 1.4k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in DevOps & Cloud. It works with daisyUI and Tailwind CSS. The repository describes itself as: Open-Source Network Management, Monitoring, ITOM, and Security Analytics. The licence is Apache-2.0.

When your agent uses it

  • DevOps & Cloud work in your project

Example prompts

  • “/daisyui-colors”

Workflow steps

10 steps, taken from the first numbered list in SKILL.md.

  1. daisyUI adds semantic color names to Tailwind CSS colors
  2. daisyUI color names can be used in utility classes, like other Tailwind CSS color names. For example, bg-primary will use the primary…
  3. daisyUI color names include variables as value so they can change based on the theme
  4. There's no need to use dark: for daisyUI color names
  5. Ideally only daisyUI color names should be used for colors so the colors can change automatically based on the theme
  6. If a Tailwind CSS color name (like red-500) is used, it will be the same red color on all themes
  7. If a daisyUI color name (like primary) is used, it will change color based on the theme
  8. Using Tailwind CSS color names for text colors should be avoided because Tailwind CSS color text-gray-800 on bg-base-100 would be…
  9. *-content colors should have a good contrast compared to their associated colors
  10. Use base-* colors for majority of the page. Use the default variant for all elements. Use primary color once only, for the most important…

What it can do on your machine

Read from SKILL.md and the folder at commit 2563b3f. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are css).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Links to these hosts (documentation or services it may open):

    • daisyui.com

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Daisyui Colors loads about 1.4k tokens when it runs. Until then it costs about 14 tokens; SKILL.md has 451 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~14
When it runs · the whole SKILL.md, loaded when a task matches
~1.4k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from carverauto/serviceradar at commit 2563b3f, republished under its Apache-2.0 licence (© carverauto). 451 words, ~1,353 tokens.

Download SKILL.mdSave it as .claude/skills/daisyui-colors/SKILL.md (or your agent's skills folder).
name
daisyui-colors
description
MANDATORY color usage rules for daisyUI 5

daisyUI 5 colors

daisyUI color names
  • primary: Primary brand color, The main color of your brand
  • primary-content: Foreground content color to use on primary color
  • secondary: Secondary brand color, The optional, secondary color of your brand
  • secondary-content: Foreground content color to use on secondary color
  • accent: Accent brand color, The optional, accent color of your brand
  • accent-content: Foreground content color to use on accent color
  • neutral: Neutral dark color, For not-saturated parts of UI
  • neutral-content: Foreground content color to use on neutral color
  • base-100:-100 Base surface color of page, used for blank backgrounds
  • base-200:-200 Base color, darker shade, to create elevations
  • base-300:-300 Base color, even more darker shade, to create elevations
  • base-content: Foreground content color to use on base color
  • info: Info color, For informative/helpful messages
  • info-content: Foreground content color to use on info color
  • success: Success color, For success/safe messages
  • success-content: Foreground content color to use on success color
  • warning: Warning color, For warning/caution messages
  • warning-content: Foreground content color to use on warning color
  • error: Error color, For error/danger/destructive messages
  • error-content: Foreground content color to use on error color
daisyUI color rules
  1. daisyUI adds semantic color names to Tailwind CSS colors
  2. daisyUI color names can be used in utility classes, like other Tailwind CSS color names. For example, bg-primary will use the primary color for the background
  3. daisyUI color names include variables as value so they can change based on the theme
  4. There's no need to use dark: for daisyUI color names
  5. Ideally only daisyUI color names should be used for colors so the colors can change automatically based on the theme
  6. If a Tailwind CSS color name (like red-500) is used, it will be the same red color on all themes
  7. If a daisyUI color name (like primary) is used, it will change color based on the theme
  8. Using Tailwind CSS color names for text colors should be avoided because Tailwind CSS color text-gray-800 on bg-base-100 would be unreadable on a dark theme - because on dark theme, bg-base-100 is a dark color
  9. *-content colors should have a good contrast compared to their associated colors
  10. Use base-* colors for majority of the page. Use the default variant for all elements. Use primary color once only, for the most important element on the page.
Show full SKILL.md (67 more words)Show less
daisyUI custom theme with custom colors

A CSS file with Tailwind CSS, daisyUI and a custom daisyUI theme looks like this:

css
@import "tailwindcss";
@plugin "daisyui";
@plugin "daisyui/theme" {
  name: "mytheme";
  default: true; /* set as default */
  prefersdark: false; /* set as default dark mode (prefers-color-scheme:dark) */
  color-scheme: light; /* color of browser-provided UI */

  --color-base-100: oklch(98% 0.02 240);
  --color-base-200: oklch(95% 0.03 240);
  --color-base-300: oklch(92% 0.04 240);
  --color-base-content: oklch(20% 0.05 240);
  --color-primary: oklch(55% 0.3 240);
  --color-primary-content: oklch(98% 0.01 240);
  --color-secondary: oklch(70% 0.25 200);
  --color-secondary-content: oklch(98% 0.01 200);
  --color-accent: oklch(65% 0.25 160);
  --color-accent-content: oklch(98% 0.01 160);
  --color-neutral: oklch(50% 0.05 240);
  --color-neutral-content: oklch(98% 0.01 240);
  --color-info: oklch(70% 0.2 220);
  --color-info-content: oklch(98% 0.01 220);
  --color-success: oklch(65% 0.25 140);
  --color-success-content: oklch(98% 0.01 140);
  --color-warning: oklch(80% 0.25 80);
  --color-warning-content: oklch(20% 0.05 80);
  --color-error: oklch(65% 0.3 30);
  --color-error-content: oklch(98% 0.01 30);

  --radius-selector: 1rem; /* border radius of selectors (checkbox, toggle, badge) */
  --radius-field: 0.25rem; /* border radius of fields (button, input, select, tab) */
  --radius-box: 0.5rem; /* border radius of boxes (card, modal, alert) */
  /* preferred values for --radius-* : 0rem, 0.25rem, 0.5rem, 1rem, 2rem */

  --size-selector: 0.25rem; /* base size of selectors (checkbox, toggle, badge). Value must be 0.25rem unless we intentionally want bigger selectors. In so it can be 0.28125 or 0.3125. If we intentionally want smaller selectors, it can be 0.21875 or 0.1875 */
  --size-field: 0.25rem; /* base size of fields (button, input, select, tab). Value must be 0.25rem unless we intentionally want bigger fields. In so it can be 0.28125 or 0.3125. If we intentionally want smaller fields, it can be 0.21875 or 0.1875 */

  --border: 1px; /* border size. Value must be 1px unless we intentionally want thicker borders. In so it can be 1.5px or 2px. If we intentionally want thinner borders, it can be 0.5px */

  --depth: 1; /* only 0 or 1 – Adds a shadow and subtle 3D depth effect to components */
  --noise: 0; /* only 0 or 1 - Adds a subtle noise (grain) effect to components */
}
Rules
  • All CSS variables above are required
  • Colors can be OKLCH or hex or other formats
  • If you're generating a custom theme, do not include the comments from the example above. Just provide the code.

People can use https://daisyui.com/theme-generator/ visual tool to create their own theme.

© carverauto, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in .agents/skills/daisyui/colors of carverauto/serviceradar.

Open the folder on GitHubat commit 2563b3f

Compare with similar skills

Daisyui Colors next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Daisyui Colors compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Daisyui Colors this skillcarverauto/serviceradar921—~1.4kAutomated safety check: PassApache-2.0
Bug Finder for daisyUIsaadeghi/daisyui43k—~2.3kAutomated safety check: PassMIT
Thesvgglincker/thesvg2.8k—~1.5kAutomated safety check: PassMIT
Triageflowershow/flowershow1.1k—~1.9kAutomated safety check: PassAGPL-3.0
Vue Component Developmentgdarko/laravel-vue-starter145—~1.1kAutomated safety check: PassMIT
DaisyUI Component Librarysaadeghi/daisyui43k—~1.3kAutomated safety check: PassMIT

Similar skills

  • Bug Finder for daisyUI

    saadeghi/daisyui

    Investigates suspected bugs in the daisyUI monorepo through read-only analysis, then writes a decision-ready fix plan in tmp/bugs without changing any product code.

    43k GitHub stars~2.3k tokensUpdated 2 days ago
    DevelopmentAuto-check passed
  • Thesvg

    glincker/thesvg

    Fetch brand SVG logos and cloud architecture icons (AWS, Azure, GCP) from theSVG.

    2.8k GitHub stars~1.5k tokensUpdated today
    DevOps & CloudAuto-check passed
  • Triage

    flowershow/flowershow

    Automatically triage a newly opened GitHub issue — categorise it, verify the claim, and apply the right category and state so a maintainer or agent can pick it up.

    1.1k GitHub stars~1.9k tokensUpdated today
    DevOps & CloudAuto-check passed
  • Vue Component Development

    gdarko/laravel-vue-starter

    Activate when creating or modifying Vue 3 components, pages, layouts, stores, or services in the frontend.

    145 GitHub stars~1.1k tokensUpdated 6 mo ago
    Frontend & DesignAuto-check passed
  • Official daisyUI skill for Tailwind CSS projects, routing to install, usage, configuration, color and per-component guides before writing any HTML or JSX with its classes.

    43k GitHub stars~1.3k tokensUpdated 2 days ago
    Frontend & DesignAuto-check passed
  • DaisyUI 5 Color Rules

    saadeghi/daisyui

    Rules for using daisyUI 5's semantic color names, such as primary and base-100, so interfaces stay readable across themes.

    43k GitHub stars~1.7k tokensUpdated 2 days ago
    Frontend & DesignAuto-check passed

More from carverauto/serviceradar

All 18 skills in this repo
  • Demo Cnpg Local Web Ng

    carverauto/serviceradar

    Run ServiceRadar web-ng locally against the live Kubernetes demo CNPG database for dashboard, SRQL, services, and UI testing.

    921 GitHub stars~672 tokensUpdated today
    Auto-check passed
  • Web Ng Docker Loop

    carverauto/serviceradar

    Run ServiceRadar elixir/web-ng locally against the Docker Compose CNPG database with copied mTLS certs and Docker secrets, then verify dashboard UI changes with Playwright.

    921 GitHub stars~737 tokensUpdated today
    Auto-check passed
  • Demo Local Rollout

    carverauto/serviceradar

    Build unpublished sha-... An agent skill from carverauto/serviceradar.

    921 GitHub stars~4.2k tokensUpdated today
    Auto-check passed
  • Demo Web Ng Fastpath

    carverauto/serviceradar

    Refresh the Kubernetes demo namespace with a web-ng-only change using the ServiceRadar fast path.

    921 GitHub stars~2.4k tokensUpdated today
    Auto-check passed
  • Fieldsurvey Local Web Ng

    carverauto/serviceradar

    Run ServiceRadar web-ng locally against the Kubernetes demo namespace FieldSurvey data, including CNPG NodePort access, NATS Object Store artifact access, authenticated browser checks, and…

    921 GitHub stars~785 tokensUpdated today
    Auto-check passed
  • Release Cut And Demo Roll

    carverauto/serviceradar

    Cut a ServiceRadar release and roll the Kubernetes demo namespace to the resulting published semver image tag through the guarded ArgoCD release branch.

    921 GitHub stars~3.9k tokensUpdated today
    Auto-check passed

Categories

Questions about Daisyui Colors

What does Daisyui Colors do?

MANDATORY color usage rules for daisyUI 5. An agent skill from carverauto/serviceradar. Daisyui Colors is an agent skill from carverauto/serviceradar.

When should I use Daisyui Colors?

Daisyui Colors fits situations like: devOps & Cloud work in your project.

How do I install Daisyui Colors in Claude Code?

Run `npx skills add carverauto/serviceradar --skill daisyui-colors -a claude-code`. Or copy the skill folder (.agents/skills/daisyui/colors in carverauto/serviceradar) into .claude/skills/daisyui-colors in your project. Claude Code loads it when a task matches its description.

How do I install Daisyui Colors in Codex?

Run `npx skills add carverauto/serviceradar --skill daisyui-colors -a codex`. Or copy the skill folder (.agents/skills/daisyui/colors in carverauto/serviceradar) into .agents/skills/daisyui-colors in your project. Codex loads it when a task matches its description.

Can I use Daisyui Colors in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add carverauto/serviceradar --skill daisyui-colors -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/daisyui-colors, .gemini/skills/daisyui-colors, .github/skills/daisyui-colors and .opencode/skills/daisyui-colors in your project.

What does Daisyui Colors need to run?

SKILL.md names no scripts, command-line tools or credentials: Daisyui Colors is instructions for the agent only.

Does Daisyui Colors access the network?

SKILL.md names 1 domain. As links in the text: daisyui.com. This is read from the text; nothing was executed.

Is Daisyui Colors safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Daisyui Colors use?

Daisyui Colors is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Daisyui Colors use?

About 1.4k tokens (SKILL.md is roughly 5.4k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Daisyui Colors?

Skills that share tags, products or a category with Daisyui Colors: Bug Finder for daisyUI (saadeghi/daisyui, 43k stars), Thesvg (glincker/thesvg, 2.8k stars), Triage (flowershow/flowershow, 1.1k stars) and Vue Component Development (gdarko/laravel-vue-starter, 145 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Daisyui Colors?

carverauto (a GitHub organization) maintains it in carverauto/serviceradar, which has 921 GitHub stars. The repository holds 18 skills in this directory. The repository was last updated on October 10, 2026.

Source: carverauto/serviceradar on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.