前端开发有个非常神奇的开源框架。 一方面，它的热度依然高得惊人。 如今 Tailwind CSS 的周安装量已经超过 1.1亿次！ChatGPT、X、Cloudflare、Reddit、Shopify 等大厂产品都在使用它。 State of CSS 2025 的调查中，51%的受访者表示使用过 Tailwind CSS，在 CSS 框架中排名第一。 但另一边，却是完全不同的故事，公司收入却断崖式下降80%，工程团队被迫裁员75%，今年9月被Shopify正式收购。 一个越来越流行的开源项目，背后的商业公司却陷入困境，听起来非常矛盾。 造成这一切的罪魁祸首就是 AI， AI 一手把它推上巅峰，然后又残忍地把它摧毁。 0 1 音乐人的意外创造 Tailwind 的作者 Adam Wathan，最开始其实是个音乐人。 他经常使用 REAPER 做音频制作，REAPER 有一个很有意思的特点：支持脚本化定制。 这意味着，你可以自己写代码，让软件自动完成一些原本需要手工操作的事情。 于是 Adam 开始学习 Python，没想到这一学，就一头扎进了代码世界。 当Adam 和朋友做一些副业项目时，他发现CSS很繁琐，明明只是调整一下间距、对齐方式、颜色，却经常需要写一堆 CSS，还得不停给各种东西起名字。 在音频混音时，录音师极度依赖快捷键、宏命令和即时反馈，绝不希望中断创作流去繁琐的菜单里找工具，这种思维被他带到了CSS领域，他开始积累一套自己可以复用的工具类（Utility Classes），例如： pt-4 ：给元素的顶部添加 16 像素的内边距。 flex ：将子元素默认横向一字排开 items-center ：使子元素居中对齐 这些小工具可以像积木一样，轻松组合，读起来也很舒服： div> 效果大概是这样（加了背景框让效果更明显） 后来Adam在YouTube 和 Twitch 直播开发 KiteTail （一个数字产品销售平台）时，发生了一件有意思的事情。 弹幕里大量开发者根本就不关注KiteTail做得怎么样，而是不断追问：你那些 pt-4、flex、items-center 到底是哪个开源库？ Adam回复说：“这没啥，就是我用 Less/PostCSS 写的脚本，不是什么开源库。” 但是询问的人越来越多，这让Adam意识到：这东西不是自己一个人的需求，而是大家都想要的东西啊。 那还等啥啊， 赶紧整理下开源吧。 Adam给这个项目起名“Tailwind”，与最初的 KiteTail（风筝尾巴）一脉相承，一个席卷前端世界的 CSS 框架，就这样诞生了。 0 2 这是历史的倒退！ Tailwind 刚发布时，就在社区引发了轩然大波。 因为主流的思路是这样的： 在HTML创建一个Button : class ="primary-button"> 在CSS中定义这个Button长什么样子: } 但TailWind却反过来了： class ="bg-blue-600 px-4 py-2 rounded-lg"> 相当于在HTML中直接描述了：蓝色背景 + 16px 左右间距 + 8px 上下间距 + 圆角 很多人认为：这不就是把内联样式写进 class 吗？完全违背了HTML 负责结构、CSS 负责样式的最佳实践！是历史的倒退！ 但是真正上手以后，大家发现Tailwind太好用了！太方便了！ 终于不用在 HTML 和 CSS 两个文件之间来回切换了！也不用为起个CSS类名绞尽脑汁了（起名可是编程里最难的事情啊）。 Adam 特别喜欢展示这种“搭积木”的能力，他在 Twitch 和 YouTube 上开启了一系列实战直播，现场挑战“用 Tailwind 重新构建 Twitter / GitHub / Spotify 界面”。 观众亲眼目睹他在短短几十分钟内，不写一行自定义 CSS，纯靠工具类搭建出像素级还原的复杂界面，这笔任何宣传都有效，Tailwind开始疯狂增长。 Adam 和视觉设计师 Steve Schoger 是多年的朋友，两人一起做过不少项目，Adam 发现，Steve 做 UI 时有大量看似凭直觉的技巧，其实完全可以拆解成一套程序员也能理解的方法。 于是，两人把这些经验整理成了《Refactoring UI》。 这本书特别适合程序员，因为它没有跟你大讲抽象的设计理论，而是直接告诉你： 怎么把一个丑陋的页面，改得像个正常产品。 这本书对于像我这样想最初漂亮界面，但是又不知道怎么办的程序员来说，简直就是福音啊。 它第一天就卖出了接近 40 万美元，第一个月突破 100 万美元，后来累计销售额超过 250 万美元。 这笔钱也成为 Tailwind Labs 的启动资金，公司也因此走了一条罕见的路：不融风险投资，纯靠产品收入滚