{"id":"166bc768-001d-4575-a37a-1951b15474be","shortId":"TrNzBt","kind":"skill","title":"Unocss","tagline":"Skills skill by Antfu","description":"UnoCSS is an instant atomic CSS engine designed to be flexible and extensible. The core is un-opinionated - all CSS utilities are provided via presets. It's a superset of Tailwind CSS, so you can reuse your Tailwind knowledge for basic syntax usage.\n\n**Important:** Before writing UnoCSS code, agents should check for `uno.config.*` or `unocss.config.*` files in the project root to understand what presets, rules, and shortcuts are available. If the project setup is unclear, avoid using attributify mode and other advanced features - stick to basic `class` usage.\n\n> The skill is based on UnoCSS 66.x, generated at 2026-01-28.\n\n## Core\n\n| Topic | Description | Reference |\n|-------|-------------|-----------|\n| Configuration | Config file setup and all configuration options | [core-config](references/core-config.md) |\n| Rules | Static and dynamic rules for generating CSS utilities | [core-rules](references/core-rules.md) |\n| Shortcuts | Combine multiple rules into single shorthands | [core-shortcuts](references/core-shortcuts.md) |\n| Theme | Theming system for colors, breakpoints, and design tokens | [core-theme](references/core-theme.md) |\n| Variants | Apply variations like hover:, dark:, responsive to rules | [core-variants](references/core-variants.md) |\n| Extracting | How UnoCSS extracts utilities from source code | [core-extracting](references/core-extracting.md) |\n| Safelist & Blocklist | Force include or exclude specific utilities | [core-safelist](references/core-safelist.md) |\n| Layers & Preflights | CSS layer ordering and raw CSS injection | [core-layers](references/core-layers.md) |\n\n## Presets\n\n### Main Presets\n\n| Topic | Description | Reference |\n|-------|-------------|-----------|\n| Preset Wind3 | Tailwind CSS v3 / Windi CSS compatible preset (most common) | [preset-wind3](references/preset-wind3.md) |\n| Preset Wind4 | Tailwind CSS v4 compatible preset with modern CSS features | [preset-wind4](references/preset-wind4.md) |\n| Preset Mini | Minimal preset with essential utilities for custom builds | [preset-mini](references/preset-mini.md) |\n\n### Feature Presets\n\n| Topic | Description | Reference |\n|-------|-------------|-----------|\n| Preset Icons | Pure CSS icons using Iconify with any icon set | [preset-icons](references/preset-icons.md) |\n| Preset Attributify | Group utilities in HTML attributes instead of class | [preset-attributify](references/preset-attributify.md) |\n| Preset Typography | Prose classes for typographic defaults | [preset-typography](references/preset-typography.md) |\n| Preset Web Fonts | Easy Google Fonts and other web fonts integration | [preset-web-fonts](references/preset-web-fonts.md) |\n| Preset Tagify | Use utilities as HTML tag names | [preset-tagify](references/preset-tagify.md) |\n| Preset Rem to Px | Convert rem units to px for utilities | [preset-rem-to-px](references/preset-rem-to-px.md) |\n\n## Transformers\n\n| Topic | Description | Reference |\n|-------|-------------|-----------|\n| Variant Group | Shorthand for grouping utilities with common prefixes | [transformer-variant-group](references/transformer-variant-group.md) |\n| Directives | CSS directives: @apply, @screen, theme(), icon() | [transformer-directives](references/transformer-directives.md) |\n| Compile Class | Compile multiple classes into one hashed class | [transformer-compile-class](references/transformer-compile-class.md) |\n| Attributify JSX | Support valueless attributify in JSX/TSX | [transformer-attributify-jsx](references/transformer-attributify-jsx.md) |\n\n## Integrations\n\n| Topic | Description | Reference |\n|-------|-------------|-----------|\n| Vite Integration | Setting up UnoCSS with Vite and framework-specific tips | [integrations-vite](references/integrations-vite.md) |\n| Nuxt Integration | UnoCSS module for Nuxt applications | [integrations-nuxt](references/integrations-nuxt.md) |","tags":["unocss","skills","antfu"],"capabilities":["skill","source-antfu","category-skills"],"categories":["skills"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/antfu/skills/unocss","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"install_from":"skills.sh"}},"qualityScore":"0.300","qualityRationale":"deterministic score 0.30 from registry signals: · indexed on skills.sh · published under antfu/skills","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill:v1","enrichmentVersion":1,"enrichedAt":"2026-04-24T00:40:12.741Z","embedding":null,"createdAt":"2026-04-18T20:25:10.615Z","updatedAt":"2026-04-24T00:40:12.741Z","lastSeenAt":"2026-04-24T00:40:12.741Z","tsv":"'-01':106 '-28':107 '2026':105 '66':101 'advanc':88 'agent':55 'antfu':5 'appli':162,372 'applic':432 'atom':10 'attribut':287 'attributifi':84,282,293,394,398,403 'avail':75 'avoid':82 'base':98 'basic':47,92 'blocklist':187 'breakpoint':153 'build':256 'category-skills' 'check':57 'class':93,290,298,381,384,388,392 'code':54,181 'color':152 'combin':138 'common':227,362 'compat':224,237 'compil':380,382,391 'config':113,122 'configur':112,118 'convert':338 'core':20,108,121,134,145,158,171,183,195,208 'core-config':120 'core-extract':182 'core-lay':207 'core-rul':133 'core-safelist':194 'core-shortcut':144 'core-them':157 'core-vari':170 'css':11,26,38,131,200,205,220,223,235,241,269,370 'custom':255 'dark':166 'default':301 'descript':110,215,264,353,408 'design':13,155 'direct':369,371,378 'dynam':127 'easi':309 'engin':12 'essenti':252 'exclud':191 'extens':18 'extract':174,177,184 'featur':89,242,261 'file':62,114 'flexibl':16 'font':308,311,315,320 'forc':188 'framework':419 'framework-specif':418 'generat':103,130 'googl':310 'group':283,356,359,367 'hash':387 'hover':165 'html':286,327 'icon':267,270,275,279,375 'iconifi':272 'import':50 'includ':189 'inject':206 'instant':9 'instead':288 'integr':316,406,411,423,427,434 'integrations-nuxt':433 'integrations-vit':422 'jsx':395,404 'jsx/tsx':400 'knowledg':45 'layer':198,201,209 'like':164 'main':212 'mini':248,259 'minim':249 'mode':85 'modern':240 'modul':429 'multipl':139,383 'name':329 'nuxt':426,431,435 'one':386 'opinion':24 'option':119 'order':202 'prefix':363 'preflight':199 'preset':31,70,211,213,217,225,229,232,238,244,247,250,258,262,266,278,281,292,295,303,306,318,322,331,334,346 'preset-attributifi':291 'preset-icon':277 'preset-mini':257 'preset-rem-to-px':345 'preset-tagifi':330 'preset-typographi':302 'preset-web-font':317 'preset-wind3':228 'preset-wind4':243 'project':65,78 'prose':297 'provid':29 'pure':268 'px':337,342,349 'raw':204 'refer':111,216,265,354,409 'references/core-config.md':123 'references/core-extracting.md':185 'references/core-layers.md':210 'references/core-rules.md':136 'references/core-safelist.md':197 'references/core-shortcuts.md':147 'references/core-theme.md':160 'references/core-variants.md':173 'references/integrations-nuxt.md':436 'references/integrations-vite.md':425 'references/preset-attributify.md':294 'references/preset-icons.md':280 'references/preset-mini.md':260 'references/preset-rem-to-px.md':350 'references/preset-tagify.md':333 'references/preset-typography.md':305 'references/preset-web-fonts.md':321 'references/preset-wind3.md':231 'references/preset-wind4.md':246 'references/transformer-attributify-jsx.md':405 'references/transformer-compile-class.md':393 'references/transformer-directives.md':379 'references/transformer-variant-group.md':368 'rem':335,339,347 'respons':167 'reus':42 'root':66 'rule':71,124,128,135,140,169 'safelist':186,196 'screen':373 'set':276,412 'setup':79,115 'shortcut':73,137,146 'shorthand':143,357 'singl':142 'skill':2,3,96 'sourc':180 'source-antfu' 'specif':192,420 'static':125 'stick':90 'superset':35 'support':396 'syntax':48 'system':150 'tag':328 'tagifi':323,332 'tailwind':37,44,219,234 'theme':148,149,159,374 'tip':421 'token':156 'topic':109,214,263,352,407 'transform':351,365,377,390,402 'transformer-attributify-jsx':401 'transformer-compile-class':389 'transformer-direct':376 'transformer-variant-group':364 'typograph':300 'typographi':296,304 'un':23 'un-opinion':22 'unclear':81 'understand':68 'unit':340 'uno.config':59 'unocss':1,6,53,100,176,414,428 'unocss.config':61 'usag':49,94 'use':83,271,324 'util':27,132,178,193,253,284,325,344,360 'v3':221 'v4':236 'valueless':397 'variant':161,172,355,366 'variat':163 'via':30 'vite':410,416,424 'web':307,314,319 'wind3':218,230 'wind4':233,245 'windi':222 'write':52 'x':102","prices":[{"id":"09336c3a-0b0b-49a9-971d-d580c8c6f674","listingId":"166bc768-001d-4575-a37a-1951b15474be","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"antfu","category":"skills","install_from":"skills.sh"},"createdAt":"2026-04-18T20:25:10.615Z"}],"sources":[{"listingId":"166bc768-001d-4575-a37a-1951b15474be","source":"github","sourceId":"antfu/skills/unocss","sourceUrl":"https://github.com/antfu/skills/tree/main/skills/unocss","isPrimary":false,"firstSeenAt":"2026-04-18T21:53:51.068Z","lastSeenAt":"2026-04-23T18:53:29.788Z"},{"listingId":"166bc768-001d-4575-a37a-1951b15474be","source":"skills_sh","sourceId":"antfu/skills/unocss","sourceUrl":"https://skills.sh/antfu/skills/unocss","isPrimary":true,"firstSeenAt":"2026-04-18T20:25:10.615Z","lastSeenAt":"2026-04-24T00:40:12.741Z"}],"details":{"listingId":"166bc768-001d-4575-a37a-1951b15474be","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"antfu","slug":"unocss","source":"skills_sh","category":"skills","skills_sh_url":"https://skills.sh/antfu/skills/unocss"},"updatedAt":"2026-04-24T00:40:12.741Z"}}