Agent Skills
› nexu-io/motion-anything
› gooey-nav
gooey-nav
GitHub实现无依赖、支持减少动态偏好设置的圆角滑动导航栏。提供CSS与JS，通过复制代码并应用特定类名即可在视图中添加平滑的 segmented control 效果。
Trigger Scenarios
需要实现平滑滑动导航指示器
构建分段控件或标签页导航
Install
npx skills add nexu-io/motion-anything --skill gooey-nav -g -y
SKILL.md
Frontmatter
{
"od": {
"mode": "prototype",
"preview": {
"type": "html"
},
"surface": "web",
"category": "animation-motion",
"platform": "desktop",
"design_system": {
"requires": false
}
},
"name": "gooey-nav",
"triggers": [
"gooey nav",
"liquid tabs",
"果冻导航",
"液态标签"
],
"description": "A pill slides under the active nav item with a springy merge — a smooth segmented control. One per view. Under prefers-reduced-motion the pill jumps without easing.\n"
}
gooey-nav
Gooey Nav Dependency-free, reduced-motion safe.
How to apply
Copy css+js; <nav class="gnav"><span class="gn-pill"></span><button class="on">Home</button>…</nav>.
Version History
- b016900 Current 2026-07-11 17:08
