Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add instructions/thesethrose/copilot-skills/tailwindgit clone --depth 1 https://github.com/TheSethRose/Copilot-SkillsWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/instructions/thesethrose/copilot-skills/tailwind)<a href="https://agentmods.dev/instructions/thesethrose/copilot-skills/tailwind"><img src="https://agentmods.dev/badge/instructions/thesethrose/copilot-skills/tailwind.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.02060 | $0.02060 |
| Opus 5 | $0.01030 | $0.01030 |
| Sonnet 5 | $0.00412 | $0.00412 |
| Haiku 4.5 | $0.00206 | $0.00206 |
Grade A, and why
Copilot-Skills tailwind.instructions.md scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured yesterday.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 230 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Tailwind CSS v4 - Automatic Context Instructions
Related Prompt: /tailwind
Related Skill: .github/copilot-skills/frontend/tailwind-v4/
Triggers: tailwind, css utilities, responsive design, dark mode, styling, breakpoint, hover state
Context: Utility-First CSS Framework
When working with Tailwind CSS files or styling with utility classes, this context is automatically activated.
Core Principles
Mobile-First Responsive Design
- No prefix = applies to all screen sizes
- sm, md, lg, xl, 2xl = breakpoint prefixes (add at or above that size)
- Example:
w-1/2 md:w-1/3 lg:w-1/4= different widths at each breakpoint - Default breakpoints: sm (640px), md (768px), lg (1024px), xl (1280px), 2xl (1536px)
Variant Stacking (Left to Right)
- v4 change: Variants apply left-to-right, not right-to-left
- Hover:
hover:bg-blue-600applies on hover - Dark mode:
dark:text-whiteapplies in dark mode - Combine:
dark:hover:bg-blue-600= dark mode hover state - Responsive:
md:dark:hover:underline= medium screens and up, dark mode, on hover
CSS Variables as First-Class
- v4 removed
@tailwinddirectives (v3:@tailwind base;) - v4 requires:
@import "tailwindcss"; - Theme variables: Access colors via
var(--color-blue-500)in custom CSS - Custom properties: Define with
@theme { --my-color: #123456; }
Default Behaviors
When styling a component
- Start with layout utilities (
flex,grid,block,display) - Add spacing (
p-4,m-6,gap-4) - Add typography (
text-lg,font-bold) - Add colors (
bg-blue-500,text-gray-700) - Add effects (
shadow,rounded-lg) - Add responsive prefixes (
md:,lg:) - Add interactive states (
hover:,focus:,dark:)
When using dark mode
- Add
dark:prefix to utilities that should change:bg-white dark:bg-gray-900 - Dark mode uses
@media (prefers-color-scheme: dark)by default - Can be overridden with class-based approach:
<html class="dark">
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- yesterday First seen · 230 lines · 2,060 tokens per session scan A a2024d6c61f7
Copilot-Skills tailwind.instructions.md is an instructions file published in the GitHub repository TheSethRose/Copilot-Skills (3 stars, last pushed 8mo ago), licensed MIT. It adds 2,060 tokens to every session, about $0.0103 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-09-03.
Other instructions, from other repositories
web-quality-skills CLAUDE.md
Instructions for addyosmani/web-quality-skills, covering claude.md, project summary, quick reference, available skills and key thresholds.
turbo CLAUDE.md
Claude Code instructions for tobihagemann/turbo, covering turbo, project structure and key files.
platform-skills copilot-instructions.md
Copilot instructions for nitinjain999/platform-skills, covering platform engineering instructions for github copilot, version: 1.40.0, source: https://github.com/nitinjain999/platform-skills, response contract and core principles.
agent-teacher CLAUDE.md
Claude Code instructions for JackyYang258/agent-teacher, covering agentteacher, before you start, common commands and project-specific hard rules.
copilot-guide copilot-instructions.md
Instructions for nishanil/copilot-guide, covering copilot-guide — copilot instructions, what this repo is, contribution conventions, style rules and what not to change.
forge CLAUDE.md
Instructions for zjio26/forge, covering claude.md, project overview, architecture, wave-based processing and test layering.