smithery/onmax
Use when writing UnoCSS with presetOnmax workflow - covers attribute mode patterns, fluid spacing (f- prefix), scale-to-pixel (1px base), custom variants (hocus, reka-*, data-state), nimiq-css design system (nq-* utilities), and Reka UI integration.
Related neighbors and high-traction skills in the same topics — useful to compare before installing.
Browser automation CLI for AI agents. Use when the user needs to interact with websites, includ…
810.4K installsReview UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "chec…
617.3K installsBuild, deploy, evaluate, optimize, fine-tune, and manage Microsoft Foundry agents, models, and …
576.5K installsArchitect and provision enterprise Azure infrastructure from workload descriptions. For cloud a…
402.8K installsOther skills from smithery/onmax · top by installs.
npx skills add smithery/onmax
Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.
Files included with this skill beyond the listing page.
SKILL.md
2,069 B
SUMMARY.md
352 B
Custom UnoCSS workflow using unocss-preset-onmax with fluid sizing, 1px-base spacing, and attributify mode.
| Concept | Pattern | Example |
|---|---|---|
| Attribute mode | attr="~ value" |
flex="~ col gap-8" |
| Fluid spacing | f-{util}-{size} |
f-px-md, f-pt-2xl |
| Scale-to-px | 1rem = 4px | p-16 = 16px |
| hocus | hover + focus | bg="neutral hocus:blue" |
| size-X | width + height | size-40 = 40×40px |
Load based on task:
| Task | File |
|---|---|
| Configuring uno.config.ts | [preset-onmax.md](preset-onmax.md) |
| Writing component styles | [attributify.md](attributify.md) |
| Responsive typography/spacing | [fluid-sizing.md](fluid-sizing.md) |
| State selectors, dark mode | [variants.md](variants.md) |
| nimiq-css utilities (nq-*) | [nimiq-css.md](nimiq-css.md) |
DO NOT load all files. Each ~400-800 tokens. Load only what's needed.
<div flex="~ col items-center gap-16">
<div text="f-xl neutral-800">
<button bg="neutral-0 hocus:neutral-50">
<div outline="~ 1.5 offset--1.5 neutral/10">2xs=8/12 xs=12/16 sm=16/24 md=24/32 lg=32/48 xl=48/72 2xl=72/96size-40 rounded-full <!-- Circle button -->
f-px-md f-pt-sm <!-- Fluid padding -->
outline="1.5 offset--1.5" <!-- Inset outline -->
hocus:bg-neutral-100 <!-- Hover+focus -->
stack <!-- Centered grid overlay -->