惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Microsoft Azure Blog
Microsoft Azure Blog
C
Cisco Blogs
WordPress大学
WordPress大学
H
Hackread – Cybersecurity News, Data Breaches, AI and More
The Cloudflare Blog
小众软件
小众软件
Recent Commits to openclaw:main
Recent Commits to openclaw:main
I
Intezer
Cyberwarzone
Cyberwarzone
T
The Blog of Author Tim Ferriss
博客园 - Franky
F
Fortinet All Blogs
C
Cyber Attacks, Cyber Crime and Cyber Security
G
Google Developers Blog
Recent Announcements
Recent Announcements
I
InfoQ
T
Threat Research - Cisco Blogs
V
V2EX
T
Tenable Blog
H
Help Net Security
Cisco Talos Blog
Cisco Talos Blog
T
Tailwind CSS Blog
cs.CL updates on arXiv.org
cs.CL updates on arXiv.org
The GitHub Blog
The GitHub Blog
P
Privacy & Cybersecurity Law Blog
A
Arctic Wolf
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
D
DataBreaches.Net
罗磊的独立博客
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
D
Docker
T
Tor Project blog
Attack and Defense Labs
Attack and Defense Labs
P
Proofpoint News Feed
H
Heimdal Security Blog
Engineering at Meta
Engineering at Meta
雷峰网
雷峰网
Martin Fowler
Martin Fowler
AWS News Blog
AWS News Blog
IT之家
IT之家
Google DeepMind News
Google DeepMind News
NISL@THU
NISL@THU
Google Online Security Blog
Google Online Security Blog
Vercel News
Vercel News
K
KPMG report finds enterprise disconnect between AI and its ROI | CIO
SecWiki News
SecWiki News
GbyAI
GbyAI
P
Proofpoint News Feed
月光博客
月光博客
Schneier on Security
Schneier on Security

串串狗小刊 ⭐️

年轻人怎么抓住 AI 发展的风口? - 串串狗小刊 为什么 GO 语言地位很尴尬? - 串串狗小刊 Web 出海必备的外链列表 - 串串狗小刊 - 聊AI、互联网、前端技术 ~ 我的 Web 3D 世界梦 - 串串狗小刊 OPC Web 出海之图视频的 AI 供应商渠道和简单外链 - 串串狗小刊 简单聊聊我的 Nodejs 世界观 - 串串狗小刊 Web 出海快速判断关键词法和推荐 3 个 SKILL - 串串狗小刊 Web 出海之演示建站盈利和朋友 Reyn 的教训 阅读源代码前要运行的 5 条 Git 命令 - 串串狗小刊 介绍几组我一直在使用的 Codex 插件 我观看哥飞年终会议复盘的 Web 出海笔记(下) - 串串狗小刊 观看哥飞年终会议复盘的 8 个 Web 出海笔记 - 串串狗小刊 Codex 敞开用的技巧和谷歌趋势的参考词 - 串串狗小刊 - 聊AI、互联网、前端技术 ~ Web 出海之外链提交频率和如何不花 Token 处理代码 - 串串狗小刊 程序员现在的最佳副业 ~ Web 出海 - 串串狗小刊 如何设计良好的 API - 串串狗小刊 - 聊AI、互联网、前端技术 ~ 你跟 AI 对话后会发生什么? - 串串狗小刊 出海 Web 之 GSC 里的曝光量和点击量和外链的关系 - 串串狗小刊 出海 Web 不要 恋战 新词游戏站 - 串串狗小刊 无港卡开通 Stripe 收款和 Nofollow 转 Dofollow 技巧 - 串串狗小刊 DeepSeek 发布氮气加速器 DSpark!可惜好东西又开源了 - 串串狗小刊 简单聊聊出海 Web 的游戏站 - 串串狗小刊 停止使用 JWT ! - 串串狗小刊 出海 SEO 之 Vercel App 找词法与 agentic-inbox 管理邮箱 - 串串狗小刊 出海 Web 之 Vercel 的必踩坑和 140 分钟需求调研 - 串串狗小刊 出海 Web 之根据调研结果,挑选需求 - 串串狗小刊 超惊艳的 3D 开放世界浏览器游戏 LAAS ,全程 Claude Fable 5 无干预开发 - 串串狗小刊 月入 4w 刀的小耳朵 sir 的出海经验 - 串串狗小刊 出海建站之 Product Hunt 的封号限制解封 - 串串狗小刊 出海 SEO 新手们,给你们分享个新词发现工具! - 串串狗小刊 Node-js 新手需要知道什么? - 串串狗小刊 - 聊AI、互联网、前端技术 ~ 用 AI 挑选 skill 头疼?聊聊四大 skill 仓库 - 串串狗小刊 让老外感受到了中国 SEO 的威力,amazing! - 串串狗小刊 驾驭工程后,AI 圈又一个新概念 Loop 工程(循环工程) - 串串狗小刊 Deepseek V4 Pro 极高的缓存命中率很重要! - 串串狗小刊 SEO 出海之田七使用 google trends 的经验 - 串串狗小刊 今年最燃Web出海奇迹,小白从0建站一个月入万刀全程详细复盘! - 串串狗小刊 - 聊AI、互联网、前端技术 ~ 两个朋友做跨境独立站编程出海的经历、找词技巧 - 串串狗小刊 - 聊AI、互联网、前端技术 ~ SEO 之用 coolify 部署 nextjs 和 面包屑 使用误区 - 串串狗小刊 注意,JS 里的 JSON.parse() 也有安全隐患! - 串串狗小刊 拆解 aidocmaker 这个 SEO 神站,聊聊 Lovart 的交互设计 - 串串狗小刊 三个最近做 SaaS 的 JS 小技巧 - 串串狗小刊 关键词评估和 reddit、HN、product hurt 起号运营小妙招! - 串串狗小刊 WASM、Rust,前端的第二条命! - 串串狗小刊 - 聊AI、互联网、前端技术 ~ SEO 之 UGC 不做落地页和 ADS 无效流量解决方法 - 串串狗小刊 SEO 之 HARO 四两拨千斤大法 - 串串狗小刊 SEO 里的 schema 和 积沙成塔 - 串串狗小刊 AI 生成的代码太啰嗦 今日 SEO 小经验分享 - 串串狗小刊 时代在轮回,2026 年做网站又开始流行起来 - 串串狗小刊 - 聊AI、互联网、前端技术 ~ 讲一下谷歌 SEO 常用的 8 个工具 - 串串狗小刊 五个谷歌 SEO 外链建设小妙招 - 串串狗小刊 分享几个 独立站 SEO 外链 建设的小经验 - 串串狗小刊 讲几个 出海独立开发 获取流量的经验 - 串串狗小刊 一个故事,把大厂互联网架构 70+ 概念串完 - 串串狗小刊 2026 年最新的 人工智能 学习路线(为期三个月) - 串串狗小刊 为什么现在的密码喜欢使用 2FA(TOTP、passkey )? - 串串狗小刊 openAI 团队告诉你,怎么把 Codex 用到极致! - 串串狗小刊 fetch 和 axios ,两者选谁? - 串串狗小刊 五年了,Zed 终于发布 1.0 版本了,简单聊聊 - 串串狗小刊 由 27 个荒废的项目,总结的 5 个失败的真相 - 串串狗小刊 今天再聊聊 Codex 的使用 - 串串狗小刊 分享几个短小精悍实用的 js 代码 - 串串狗小刊 54 天,26.9 万次连接:互联网到底有多吵? - 串串狗小刊 AI 时代前端开发最实用的 5 种设计模式 - 串串狗小刊 说 3 个前端新手可能不知道的技巧 - 串串狗小刊 Vite 这个前端打包工具是怎么工作的呢? - 串串狗小刊 - 聊AI、互联网、前端技术 ~ Vibe coding 一词发明人说 Agentic Engineering ,守住软件质量才是未来 - 串串狗小刊 如何利用 AI 理解新项目、接手新项目? - 串串狗小刊 2025 年主流的前端技术全集合 - 串串狗小刊 - 聊AI、互联网、前端技术 ~ 德鲁・布伦尼格提出是 10 个 AI 编程时代的实践经验 - 串串狗小刊 其实 React 有点难用 - 串串狗小刊 今天简单聊聊 tailwindCSS - 串串狗小刊 - 聊AI、互联网、前端技术 ~ 今天再聊聊 AI GEO,以及改善其效果的办法 - 串串狗小刊 Claude Code 向 Codex 的习惯迁移 - 串串狗小刊 几个提高 AI 提示词撰写能力的技巧 - 串串狗小刊 前端优化:核心 SEO 网页指标优化 LCP、INP 的思路 - 串串狗小刊 一个很冷门的 JS 知识点:逗号操作符 - 串串狗小刊 在 JS 中为什么要少用 class ? - 串串狗小刊 前端和后端是怎么连接的?API、RESTful、JSON、CORS都是什么? - 串串狗小刊 - 聊AI、互联网、前端技术 ~ 八个软件工程师需要了解的定理法则 - 串串狗小刊 - 聊AI、互联网、前端技术 ~ 思想实验:如果 AI 出现在 2010 年会发生什么? - 串串狗小刊 求求你别再 .filter().map().sort() 了 - 串串狗小刊 一文讲清 16 个 React 常用钩子的机制和使用场景 - 串串狗小刊 三大反向代理 Nginx、Traefik、Caddy 的区别是什么? - 串串狗小刊 为什么我觉得 adhd 病是一种智商税 ? 为什么有些人天生就不快乐 ? - 串串狗小刊 讲 3 个我这几天刚刚遇到的 CSS 里的小技巧 - 串串狗小刊 SQL数据库中什么情况该加索引?以及常见的陷阱。 - 串串狗小刊 - 聊AI、互联网、前端技术 ~ 2026 年前端死透了吗?还能入行吗? - 串串狗小刊 - 聊AI、互联网、前端技术 ~ 你其实永远也用不到数据库! - 串串狗小刊 - 聊AI、互联网、前端技术 ~ 八个和 Claude Code 编码时的小技巧 - 串串狗小刊 10 分钟快速入手 React 概念,然后开始干活儿 - 串串狗小刊
AI 时代前端写 UI 必备的 49 种 UI 风格! - 串串狗小刊
独元殇 · 2026-06-23 · via 串串狗小刊 ⭐️

(本文会介绍 49 种前端风格的名词(这本来是艺术生才知道的),以及对应的图片效果)

AI 时代,设计师有时候就不需要了,很多小项目,直接让 AI 生成就 OK ,用成什么样,就什么样,直接迭代,任 AI 自己随心所欲搞成什么样。

然后我们前端领域,目前为了保持品控,很多都会使用 skill ,最主流的 skill 就是大名鼎鼎的 ui-ux-pro-max-skill 了,目前有 95k 个 star 了!

GitHub 仓库在此 : https://github.com/nextlevelbuilder/ui-ux-pro-max-skill

它会帮你生成比较专业的 UI 界面。至于细调等等,这个时代已经用不到了。

它里面确实有现成的大量的提示词,不过,我们毕竟是前端程序员,颗粒度还是要小一点,最好使用里面的 49 种通用前端风格。

在 readme 里面标出来了:

大家过去,随心所欲去生成网页是,是怎么描述自己的风格的?!

黑白线条风?简约风?漫画风?Apple风 ?GPT风 ?claude风 ?谷歌风 ?或者 ,明日方舟风?

其实安装上这个 skill 后,可以按照里面的 readme 里现成的风格来搞。

但是,这些名字太抽象了,即便我是专业前端,我也很难想象出它长什么样。

我在 bilibili 上,看到有大神(每周一个idea),使用这个 skill ,按照同一个结构,让 AI 生成了每种风格的样子 :

【ui-ux-pro-max-skill上的49种前端UI通用风格】

真是太实用了,以后就不用自己发明名词去引导 AI 了,我接下来挨个给大家挨个截图过来一下(侵删),真是宝藏,也让我学到了很多新名词,我自己也想整理成文章,以后用起来方便查找:

第一种,极简主义与瑞士风格(Minimalism & Swiss Style),推荐用于企业应用、仪表盘、文档。

第二种,新拟态风格(Neumorphism),推荐用于健康应用、冥想平台、轻柔型工具。

第三种,玻璃拟态风格(Glassmorphism),推荐用于现代 SaaS、金融仪表盘。

第四种,粗野主义风格(Brutalism),推荐用于设计作品集、艺术项目。

第五种,3D 与超写实风格(3D & Hyperrealism),推荐用于游戏、产品展示、沉浸式页面。

第六种,鲜艳色块风格(Vibrant & Block-based),推荐用于创业公司、创意机构、游戏产品。

第七种,OLED 深色模式(Dark Mode OLED),推荐用于夜间模式应用、代码平台。

第八种,无障碍与伦理设计(Accessible & Ethical),推荐用于政府、医疗、教育。

第九种,黏土拟态风格(Claymorphism),推荐用于教育应用、儿童应用、SaaS 产品。

第十种,极光界面风格(Aurora UI),推荐用于现代 SaaS、创意机构。

第十一种,复古未来主义(Retro-Futurism),推荐用于游戏、娱乐、音乐平台。

第十二种,扁平化设计(Flat Design),推荐用于网页应用、移动应用、创业 MVP 。

第十三种,拟物化设计(Skeuomorphism),推荐用于老式应用、游戏、高端产品。

第十四种,液态玻璃风格(Liquid Glass),推荐用于高端 SaaS、高端电商。

第十五种,动效驱动风格(Motion-Driven),推荐用于作品集网站、叙事型平台。

第十六种,微交互风格(Micro-interactions),推荐用于移动应用、触屏界面。

第十七种,包容性设计(Inclusive Design),推荐用于公共服务、教育、医疗。

第十八种,零界面设计(Zero Interface),推荐用于语音助手、AI 平台。

第十九种,柔和 UI 进化风格(Soft UI Evolution),推荐用于现代企业应用、SaaS 产品。

第二十种,新粗野主义风格(Neubrutalism),推荐用于 Z 世代品牌、创业公司、Figma 风产品。

第二十一种,便当盒网格风格(Bento Box Grid),推荐用于仪表盘、产品页、作品集。

第二十二种,Y2K 美学风格(Y2K Aesthetic),推荐用于时尚品牌、音乐、Z 世代内容。

第二十三种,赛博朋克界面(Cyberpunk UI),推荐用于游戏、科技产品、加密应用。

第二十四种,有机亲自然风格(Organic Biophilic),推荐用于健康应用、可持续品牌。

第二十五种,AI 原生界面(AI-Native UI),推荐用于 AI 产品、聊天机器人、Copilot 工具。

第二十六种,孟菲斯设计风格(Memphis Design),推荐用于创意机构、音乐、年轻品牌。

第二十七种,蒸汽波风格(Vaporwave),推荐用于音乐平台、游戏、作品集。

第二十八种,维度分层风格(Dimensional Layering),推荐用于仪表盘、卡片布局、弹窗。

第二十九种,夸张极简主义(Exaggerated Minimalism),推荐用于时尚、建筑、作品集。

第三十种,动态字体排版(Kinetic Typography),推荐用于首页首屏、营销网站。

第三十一种,视差叙事风格(Parallax Storytelling),推荐用于品牌故事、产品发布页。

第三十二种,瑞士现代主义 2.0(Swiss Modernism 2.0),推荐用于企业网站、建筑、编辑类页面。

第三十三种,HUD 科幻界面(HUD / Sci-Fi FUI),推荐用于科幻游戏、太空科技、网络安全产品。

第三十四种,像素艺术风格(Pixel Art),推荐用于独立游戏、复古工具、创意项目。

第三十五种,便当网格风格(Bento Grids),推荐用于产品功能页、仪表盘、个人主页。

第三十六种,空间界面风格(Spatial UI VisionOS),推荐用于空间计算应用、VR、AR 。

第三十七种,电子墨水与纸张风格(E-Ink / Paper),推荐用于阅读应用、数字报纸。

第三十八种,Z 世代混乱极繁风格(Gen Z Chaos / Maximalism),推荐用于 Z 世代生活方式、音乐艺人。

第三十九种,仿生有机 2.0(Biomimetic / Organic 2.0),推荐用于可持续科技、生物科技、健康产品。

第四十种,反精致原始风格(Anti-Polish / Raw Aesthetic),推荐用于创意作品集、艺术家网站。

第四十一种,触感数字与可变形界面(Tactile Digital / Deformable UI),推荐用于现代移动应用、 playful 品牌。

第四十二种,自然提炼风格(Nature Distilled),推荐用于健康品牌、可持续产品。

第四十三种,交互式光标设计(Interactive Cursor Design),推荐用于创意作品集、互动页面。

第四十四种,语音优先多模态界面(Voice-First Multimodal),推荐用于语音助手、无障碍应用。

第四十五种,3D 产品预览(3D Product Preview),推荐用于电商、家具、时尚产品。

第四十六种,渐变网格与进化极光风格(Gradient Mesh / Aurora Evolved),推荐用于首页首屏、背景、创意页面。

第四十七种,编辑网格与杂志风格(Editorial Grid / Magazine),推荐用于新闻网站、博客、杂志。

第四十八种,色差与 RGB 分离风格(Chromatic Aberration / RGB Split),推荐用于音乐平台、游戏、科技产品。

第四十九种,复古胶片与模拟风格(Vintage Analog / Retro Film),推荐用于摄影、音乐、黑胶唱片品牌。

大家一一对照,认领自己喜欢的风格!