菜单
Keeps agents up to date on modern CSS capabilities and replacements for legacy approaches. Use this when editing CSS files.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Communication behavior for leader agents who speak directly to users. Language matching, dense precision, fact verification, and clear-as-possible answers.
Shared dependency version catalog for dependency-installing and dependency-bumping agents. Load before adding, updating, or recommending dependencies.
Ultra-compressed English-only communication. Drops everything non-essential. Keeps full technical accuracy. No tiers, no modes.
Use this when you need to build, debug, capture, validate, and refine Godot games end to end with native GDScript, staged planning, scene builders, visual QA, and optional 3D asset workflows.
Convert a local document or image file to a Markdown file using Mistral OCR. Supports PDF, Office, OpenDocument, images, and text/code formats. Use when you need to extract text from a file into a clean Markdown file.
Complete ruleset for authoring developer directives in the Mycelium framework
| name | modern-css-snippets |
| description | Keeps agents up to date on modern CSS capabilities and replacements for legacy approaches. Use this when editing CSS files. |
Use this skill to stay current on modern CSS capabilities and replacements for legacy approaches. These are modern CSS patterns that replace legacy JavaScript-heavy or hacky CSS approaches. Sourced from modern-css.com.
no runtime inputs required. read the appropriate reference file based on the task context.
your outputs are textual guidance and code snippets:
references/@supports feature detection when neededif local references are not readable, view them online at https://github.com/digitalygo/opencode-setup/tree/main/skills/modern-css-snippets/references
| File | Topics Covered |
|---|---|
set-01.md | Layout patterns, color functions, typography, form validation, feature detection, resets, scoped styles |
set-02.md | Scroll behaviors, animations, snapping, dark mode, media queries, logical properties |
set-03.md | Accessibility, interactions, popovers, transforms, grid areas, nesting, custom functions |
| Feature | Support Status | Fallback Strategy |
|---|---|---|
:has() | Modern browsers | Progressive enhancement |
subgrid | Firefox, Safari | Grid fallback or @supports |
| Container queries | Modern browsers | Media query fallback |
| View Transitions API | Chrome/Edge | No fallback available |
oklch() | Modern browsers | Hex/HSL fallback |
popover API | Modern browsers | JavaScript polyfill |
@function | Experimental | CSS custom properties |
@supports (property: value) {
.element {
property: value;
}
}