本期封面来自 HeroUI Pro


HeroUI 上周发布了 3.0 正式版,这应该是市面上设计风格和细节最好看的 UI 组件库了,刚发现他们还有一个 HeroUI Pro,目前半价中 ,你懂的,想团购的话可以群里聊聊。

这周要去腾讯总部做个分享,Slides 还没写完呢,本期开头就到这吧。


Resources↘

Flow Icons

精品 VSCode 图标包,包含数百个文件类型和文件夹图标,支持多种文件夹配色方案(蓝、棕、灰、绿等十色可选),可自定义箭头和文件夹图标显示,风格统一且辨识度极高。基础版免费,完整版 $5 含未来更新。原版不支持 Zed 需要用这个改一下,效果见这里

An image to describe post

Radiant

开源 Shader 与特效库,提供 50+ 个即用型网页着色器,零依赖、MIT 许可。每个 Shader 都是独立的单文件 HTML,可直接复制粘贴到 Claude Code、Cursor 等 AI 编码工具中进行二次定制。灵感来源涵盖 The Weeknd、Beyoncé、Dua Lipa 等流行文化元素。

An image to describe post

ASCII Magic

功能丰富的在线 ASCII 艺术生成器,支持将图片和视频(包括 GIF 动图和 MP4)转换为字符画。提供亮度、边缘检测、点阵三种渲染模式,可调节字符集、覆盖率、密度等参数,支持遮罩绘制、背景模糊、色彩混合模式等高级功能,并可导出为动画。

An image to describe post

Studio

neato.fun 出品的生成式设计工具集合,包含 ASCII、Blocks、Dither、Gradients、Lines、Organic、Plotter、Topo 八个模块,每个模块都是一个独立的参数化视觉生成器,可用于快速创建抽象纹理、图案和视觉素材。

An image to describe post

其他资源:

  • Motion Core - Svelte 原生动效组件库,集成 GSAP 和 Three.js,提供 CLI 快速初始化和组件添加,适合需要高质量运动设计、3D 画布和交互动画的 Svelte 项目。
  • Fonttrio - 为 shadcn/ui 项目设计的字体配对工具,提供 49 套现成的三字体组合(标题、正文、等宽),每套包含完整排版比例和 CSS 变量,通过 npx 一键安装。
  • Loftlyy - 品牌标识探索平台,收录持续增长的真实品牌数据库,可浏览 Logo、配色方案和设计系统,适合品牌设计师寻找灵感和参考。
  • Motionwind - 将 Framer Motion 融入 Tailwind CSS 类名的构建时动画库。通过 Babel 插件在编译时将 animate-* 类解析为 motion 组件,支持手势、滚动触发、弹簧物理、拖拽等完整 Motion 能力,零运行时开销。
  • FragCoord.xyz - Shader 效果探索与分享平台,收录大量 2D/3D 着色器作品,可在线预览和学习各类 GLSL 着色器的实现技巧。
  • OKLCH Gradient Generator - 基于 OKLCH 感知色彩空间的渐变生成器,可调节两个色标的亮度、色度和色相,支持导出 Tailwind CSS 代码和下载为图片格式,生成的渐变比传统 RGB 更均匀自然。
  • Color_Therapy_001 - Rik Oostenbroek 的限量数字壁纸,6 张高分辨率手机壁纸,探索色彩与柔和过渡。

Cases↘

Ironhill

澳大利亚创意设计工作室网站,以「地图上找不到的地方」为叙事主线,通过滚动探索式交互讲述一个充满神话色彩的品牌故事。网站将威士忌、啤酒和饮用水等产品融入森林守护者的奇幻世界观,视觉风格独特,文案极富诗意,是品牌叙事与沉浸式网页体验结合的优秀案例。

An image to describe post

John Hanacek

非常可爱的个人作品集,曾主导 Nanome VR 分子设计平台的重设计,网站展示了从 XR 界面到 Agentic 系统的多元项目,并提供 Claude Code 编码辅导服务,获 Kevin Kelly 等人推荐。

An image to describe post

Mesh

AI 驱动的人脉管理工具 Clay 改名了,重新设计了品牌形象,但是产品基本没变化。

upAn image to describe post