原生表单控件软体物理效果库
推荐指数 51.0 NO. 018 · 2026.07.21
发布2026/07/20Score125Comments43
为什么值得看
Jelly UI 是一个零依赖的 Web Components 库，给原生 HTML 表单控件加上了软体物理动画效果。对做 toC 产品或注重交互体验的 AI 应用前端来说，这可能是目前最轻量的方案，不需要重写组件体系就能让界面"活"起来。
编辑判断
前端做物理交互通常要么上 Three.js 太重，要么手写 CSS 动画效果假。Jelly UI 的聪明之处在于只劫持原生控件的渲染层，用 Web Components 封装，不破坏表单的可访问性和 SEO。
同类方案里，Framer Motion 的 spring 动画更成熟但依赖 React；这个库走原生路线，对用 Vue/Svelte 或纯 HTML 的 AI 工具型产品更友好。做 AI 生成界面、低代码平台的团队可以重点关注，它解决了一个真实痛点：LLM 生成的代码很难绑定复杂动画库，但原生标签直接替换就能出效果。
缺点是 HN 评论区有人指出软体物理在移动端性能存疑，且 WCAG AA 合规不代表屏幕阅读器体验一定好，生产环境建议先做可访问性审计。
社区反馈
意见分歧 44 条评论
核心争论：软体物理效果是否真实存在，以及动画辅助功能与演示体验的冲突
相关内容
This would be awesome if someone could add 3D rendering to make it actually look like I’m pressing a little jelly ball. It would make it so fun to press buttons that CA and EU would have to make jelly buttons illegal.
Cute (and I mean that sincerely, not sarcastically), and I appreciate that it appears to gracefully degrade for `@media (prefers-reduced-motion: reduce)`, but for the demo site, it would probably be a good idea to allow the user to override that without having to change their system settings, or at
I'm glad I read your comment, I missed that it intentionally gracefully degraded and assumed it was broken, as I'd forgotten I'd set that.