Agent skill

Daisyui Usage

by carverauto in carverauto/serviceradar

“MANDATORY usage rules for daisyUI 5”

— description from SKILL.md by carverauto
Apache-2.0Auto-check passedDevOps & Cloud

Install Daisyui Usage

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

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

GitHub CLI
$ gh skill install carverauto/serviceradar daisyui-usage --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/usage .claude/skills/daisyui-usage && 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-usage
GitHub stars
921
Token cost
~643 tokens
SKILL.md length
397 words
Files
1
Skills in repo
18
Repo updated
First seen
Licence
Apache-2.0

At a glance

  • Works in 12 steps: We can give styles to a HTML element by… → Components can be customized using… → If customization of daisyUI styles using… → …
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

About this skill

Daisyui Usage is a skill in carverauto/serviceradar (921 stars). Its SKILL.md is about 643 tokens. Licence: Apache-2.0.

Workflow steps

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

  1. We can give styles to a HTML element by adding daisyUI class names to it. By adding a component class name, part class names (if there's…
  2. Components can be customized using Tailwind CSS utility classes if the customization is not possible using the existing daisyUI classes…
  3. If customization of daisyUI styles using Tailwind CSS utility classes didn't work because of CSS specificity issues, you can use the ! at…
  4. If a specific component or something similar to it doesn't exist in daisyUI, you can create your own component using Tailwind CSS utility
  5. when using Tailwind CSS flex and grid for layout, it should be responsive using Tailwind CSS responsive utility prefixes.
  6. Only allowed class names are existing daisyUI class names or Tailwind CSS utility classes.
  7. Ideally, you won't need to write any custom CSS. Using daisyUI class names or Tailwind CSS utility classes is preferred.
  8. Suggested - if you need placeholder images, use https://picsum.photos/200/300 with the size you want
  9. Suggested - when designing, don't add a custom font unless it's necessary
  10. Don't add bg-base-100 text-base-content to body unless it's necessary
  11. For design decisions, use Refactoring UI book best practices
  12. Always use the default variant of daisyUI components unless the user asked for a specific variant or color

What it can do on your machine

Read from SKILL.md and the folder at commit f0c57eb. 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.

    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):

    • picsum.photos

    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 Usage loads about 643 tokens when it runs. Until then it costs about 12 tokens; SKILL.md has 397 words of instructions outside code blocks.

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

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 f0c57eb, republished under its Apache-2.0 licence (© carverauto). 397 words, ~643 tokens.

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

daisyUI 5 usage rules

  1. We can give styles to a HTML element by adding daisyUI class names to it. By adding a component class name, part class names (if there's any available for that component), and modifier class names (if there's any available for that component)
  2. Components can be customized using Tailwind CSS utility classes if the customization is not possible using the existing daisyUI classes. For example btn px-10 sets a custom horizontal padding to a btn
  3. If customization of daisyUI styles using Tailwind CSS utility classes didn't work because of CSS specificity issues, you can use the ! at the end of the Tailwind CSS utility class to override the existing styles. For example btn bg-red-500! sets a custom background color to a btn forcefully. This is a last resort solution and should be used sparingly
  4. If a specific component or something similar to it doesn't exist in daisyUI, you can create your own component using Tailwind CSS utility
  5. when using Tailwind CSS flex and grid for layout, it should be responsive using Tailwind CSS responsive utility prefixes.
  6. Only allowed class names are existing daisyUI class names or Tailwind CSS utility classes.
  7. Ideally, you won't need to write any custom CSS. Using daisyUI class names or Tailwind CSS utility classes is preferred.
  8. Suggested - if you need placeholder images, use https://picsum.photos/200/300 with the size you want
  9. Suggested - when designing, don't add a custom font unless it's necessary
  10. Don't add bg-base-100 text-base-content to body unless it's necessary
  11. For design decisions, use Refactoring UI book best practices
  12. Always use the default variant of daisyUI components unless the user asked for a specific variant or color
Show full SKILL.md (112 more words)Show less

daisyUI 5 class names are one of the following categories. These type names are only for reference and are not used in the actual code

  • component: the required component class
  • part: a child part of a component
  • style: sets a specific style to component or part
  • behavior: changes the behavior of component or part
  • color: sets a specific color to component or part
  • size: sets a specific size to component or part
  • placement: sets a specific placement to component or part
  • direction: sets a specific direction to component or part
  • modifier: modifies the component or part in a specific way
  • variant: prefixes for utility classes that conditionally apply styles. syntax is variant:utility-class

© 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/usage of carverauto/serviceradar.

Open the folder on GitHubat commit f0c57eb

Compare with similar skills

Daisyui Usage 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 Usage compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Daisyui Usage this skillcarverauto/serviceradar921—~643Automated 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 8 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 yesterday
    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 8 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 8 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 Usage

How do I install Daisyui Usage in Claude Code?

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

How do I install Daisyui Usage in Codex?

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

Can I use Daisyui Usage 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-usage -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-usage, .gemini/skills/daisyui-usage, .github/skills/daisyui-usage and .opencode/skills/daisyui-usage in your project.

What does Daisyui Usage need to run?

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

Does Daisyui Usage access the network?

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

Is Daisyui Usage 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 Usage use?

Daisyui Usage 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 Usage use?

About 643 tokens (SKILL.md is roughly 2.6k 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 Usage?

Skills that share tags, products or a category with Daisyui Usage: 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 Usage?

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 8, 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.