Tailwind CSS_tailwindcss生成伪元素

Tailwind CSS

Tailwind CSS是一个实用程序优先的 CSS 框架，用于快速构建自定义用户界面.

Useful Links

传奇：官方资源

• Website - 官方 Tailwind CSS 网站.
• Repository - 官方 Tailwind CSS 存储库.
• Discussions - 与其他社区成员就 Tailwind 进行联系的官方场所.
• Tailwind UI - 使用 Tailwind CSS 制作的组件库.
• Headless UI - 完全没有样式，完全可访问的 UI 组件.
• Heroicons - 精美的手工 SVG 图标.
• Play - Tailwind CSS 的高级在线游乐场.
• Just-in-time - Tailwind CSS 的即时编译器.
• Tailwind Weekly - 关于 Tailwind CSS 的所有内容的每周时事通讯.
• Built With Tailwind - 社区驱动的使用 Tailwind CSS 构建的很棒的网站集合.

IDE Extensions

传奇：官方资源

• IntelliSense for Code - Visual Studio Code 的 IntelliSense 扩展.
• Styled Snippets for Code - Visual Studio Code 的代码片段扩展.
• Headwind for Code - Visual Studio Code 的类分类器扩展.
• Shades for Code - Visual Studio Code 的调色板生成器扩展.
• IntelliSense for Neovim - Neovim 的 IntelliSense 扩展.
• Tailwind CSS Explorer for Code - 探索项目 Tailwind CSS 设置中可用的类.
• Tailwind CSS Highlight - 突出显示 Visual Studio Code 的实用程序扩展.

Plugins

Legend：官方插件·主题·实用程序·变体·组件·已弃用

• Typography - 为漂亮的排版默认添加了一个“散文”类.
• Aspect Ratio - 添加可组合的纵横比实用程序.
• Line Clamp - 提供用于在固定行数后截断文本的实用程序.
• Forms - 为表单元素添加更好的默认样式.
• Theming - 使用 CSS 变量进行主题化，支持暗模式.
• Theme Variants - 添加基于媒体查询和/或 CSS 选择器的主题变体.
• Multi Theme - 添加基于单个“主题”属性的主题变体.
• Theme Swapper - 使用 CSS 变量进行主题化，支持媒体查询.
• Themeable - 为 Tailwind CSS 添加了多个主题支持.
• Themer - 添加对带有 CSS 变量和变体的 Tailwind CSS 的主题支持.
• Radix - 添加实用程序和变体以设置 Radix UI 状态的样式.
• Custom Native - 利用 Tailwind CSS 的配置来允许创建实用程序.
• Image Rendering - 添加“图像渲染”实用程序.
• Elevation - 添加 Material UI elevation 公用事业.
• Writing Mode - 添加“写作模式”实用程序.
• Hyphens - 添加“连字符”实用程序.
• Border Gradients - 添加 border-image 渐变实用程序.
• RFS - 添加 RFS 公用事业.
• List Reset - Adds back the list-reset class that was removed prior to Tailwind CSS 1.0.
• Fluid - 添加流体尺寸实用程序.
• Typography - 添加排版实用程序.
• Triangle After - 添加 CSS 三角形实用程序.
• Scrims - 添加稀松布实用程序.
• Truncate Multiline - 添加实用程序以截断多行文本元素.
• CSS Logical Properties - 为 CSS 逻辑属性生成实用程序.
• Tooltip Arrows After - 为带有可配置边框和背景的工具提示箭头添加 CSS 实用程序.
• Bidirectional - 添加用于创建多语言双向布局的实用程序.
• Bidirectional - 将核心实用程序替换为双向兼容.
• Background SVG - 注入 SVG 作为具有颜色变体的背景图像.
• Background Unsplash - 申请 unsplash.com 图像作为背景.
• Brand Colors - 为背景、边框和文本添加各种品牌颜色.
• Bootstrap Grid - 生成 Bootstrap 风格的 flexbox 网格系统.
• Leading Trim - 添加实用程序来修剪文本空白，使用 Capsize.
• Scrollbar Hide - 添加 scrollbar-hide 类用于视觉隐藏滚动条.
• Downwind CSS Easings - 扩展 transition-timing-function 实用程序.
• Content Placeholder - 为内容占位符图像添加实用程序.
• No Scrollbar - 公开 scrollbar-none 以在视觉上隐藏滚动条.
• Fluid Type - 添加流体类型（font-size）实用程序.
• Grid Areas - 添加 grid-areas 和 grid-area 实用程序.
• Touch - 添加“触摸”变体.
• Localized - 添加基于 HTML lang 属性的变体，以仅对某些语言使用实用程序.
• Padded Radius - 添加匹配嵌套边界半径的变体.
• Fluid - 生成 fl: 变体.
• Marker - 为样式列表和提供实用程序<summary> 标记.
• Pseudo selectors - 为 Tailwind CSS 默认没有的伪类和伪元素添加变体.
• Container Queries - 添加 CSS 容器查询变体.
• FormKit - 为 FormKit 添加输入和表单状态的变体.
• Debug Screens - 添加一个显示当前活动屏幕的组件（响应断点）.
• Heropatterns - 添加 Hero Patterns 组件.
• Responsive Embed - 添加一个 responsive-embed 组件.
• Bootstrap Tables - 基于 Bootstrap 的表格添加表格组件.
• Card - 添加卡片组件.
• Skip link - 添加一个 Skip to main content 可访问组件.
• Colors to CSS Variables - 将颜色配置导出到 CSS 自定义属性.
• CSS Variables - 将配置导出到 CSS 自定义属性.
• CSS Variables - 导出自定义 CSS 变量（支持深色模式）.
• Perspective - 添加“透视”实用程序.

> - 以下插件提供的功能现已在 Tailwind CSS 中完全或部分实现.

• Caret Color - 添加“插入符号”颜色实用程序.
• Caret Color - 添加“插入符号”颜色实用程序.
• benface’s gradients - 添加渐变实用程序.
• lorisleiva’s gradients - 添加背景渐变实用程序.
• Visually Hidden - 添加屏幕阅读器实用程序.
• Object Fit - 添加 object-fit 实用程序.
• Object Position - 添加“对象位置”实用程序.
• Accessibility - 添加屏幕阅读器实用程序.
• Layout - 添加了一些布局实用程序.
• Grid - 添加 CSS 网格实用程序.
• Transforms - 添加“转换”实用程序.
• benface’s transitions - 添加可配置的转换实用程序，有或没有 CSS 变量.
• webdna’s transitions - 添加可配置的转换实用程序.
• glhd’s transitions - 添加基本的过渡实用程序.
• Cursor Extended - 扩展“光标”实用程序.
• Font Variant Numeric - 添加 font-variant-numeric 实用程序.
• Filters - 添加“过滤器”实用程序.
• CSS Filters - 添加带有默认值的 filter 和 backdrop-filter 实用程序.
• Blend Mode - 添加“混合模式”实用程序.
• Colorize - 添加“过滤器”实用程序.
• Scroll Snap - 添加 scroll-snap 实用程序.
• Scroll Behavior - 添加 scroll-smooth 和 scroll-auto 类来控制平滑滚动.
• Accent Color - 添加强调色实用程序.
• Text Indent - Adds text-indent utilities.
• Text Decoration Color - 添加 text-decoration-color 实用程序.
• Downwind CSS Text Decoration - 添加可组合的“文本装饰”实用程序.
• Capitalize first letter - 添加“大写优先”实用程序.
• Aspect Ratio - 添加“纵横比”实用程序.
• Shadow Outline Colors - 根据配置的颜色添加 box-shadow 实用程序.
• Alpha - 添加 alpha 颜色变体实用程序.
• Direction - 添加“RTL”和“LTR”变体.
• Important - 添加一个“重要”变体.
• Prefers Dark Mode - 添加基于 prefers-color-scheme 媒体查询的变体.
• Dark Mode - 添加基于 CSS 类的“暗”变体.
• Dark Mode - 添加基于 prefers-color-scheme 媒体查询的 dark 变体.
• CSS Alpha Colors - 为现有颜色添加不透明度变体.
• Pseudo - 将自定义变体添加到 Tailwind CSS 的配置中.
• Spinner - 添加微调器组件.
• Spaced Items - 添加“间隔”组件，为所有容器项目添加固定边距.
• Custom Forms - 为表单元素添加更好的默认样式.

Tools

图例：可在线访问·转换或升级工具·生成器·打字/执行·外部服务的插件/工具/扩展·颜色相关·框架

• Tailwind Color Shades - Tailwind CSS 的颜色阴影生成器.
• Palette generator - 输出 Tailwind CSS 配置文件的调色板生成器.
• Tailwind Colors - Tailwind CSS 的颜色配置生成器.
• Tailwind Color Explorer - Tailwind CSS 的颜色浏览器.
• TailwindInk - AI 调色板生成器，使用 Tailwind CSS 调色板进行训练.
• Gradient Designer - 为 Tailwind 2.0+ 生成渐变.
• Grayscale Design - 基于亮度的调色板生成器.
• Hypercolor - 带有方向选项的预配置 Tailwind CSS 渐变集合.
• Palettolithic - 基于一种颜色生成和谐调色板.
• Tailwind Gradient Generator - 使用零行代码创建完美的 Tailwind CSS 渐变.
• Ui Colors - Tailwind CSS 的调色板生成器.
• Tailwind CSS v2 colors - 带有 Tailwind CSS v2 颜色的 Figma 库.
• Colorkraken - Tailwind CSS 的颜色阴影生成器.
• babel-plugin-tailwind-dark - 使用 Babel 编译代码时添加自定义暗类的 Babel 插件.
• Twind - 在运行、服务和构建时将 Tailwind 的类转换为 CSS 的编译器函数.
• GPT-3 Tailwind CSS code generator - OpenAI GPT-3 驱动的 Tailwind CSS 代码生成器.
• Stitches - 带有 Tailwind 的模板生成器（在线）.
• tail-animista - Tailwind CSS 的可配置自定义动画实用程序生成器.
• brands-tail-color - 使用各种品牌颜色的配置生成器.
• Windframe - Tailwind CSS 拖放构建器可快速构建和原型网站.
• Typography Playground - 使用 Tailwind CSS 排版插件尝试不同的 Google 字体组合的工具.
• Play - Tailwind CSS 的高级在线游乐场.
• Updrafts.app - Tailwind CSS 的高级在线无代码拖放编辑器.
• tailwind.run - Tailwind CSS 使用内置功能（在线）.
• tailzilla.app - Tailwind CSS 的在线游乐场.
• Flowrift - 设计精美的 Tailwind CSS UI 块.
• Tailwind Automatic Prefix Applicator - Tailwind 类的前缀工具.
• CSS to Tailwind CSS Converter - 通过建议最匹配的类将 CSS 转换为 Tailwind CSS.
• Tailwindo - Bootstrap 到 Tailwind CSS 转换器.
• Tailupgrade - 用于将 HTML 文件从 Tailwind CSS v0.x 升级到 v1.0 的转换工具.
• Tailwind Shift - 从 Tailwind CSS v0.7 升级到 v1.0 的升级工具.
• RustyWind - 用于对 Tailwind CSS 类进行排序的 CLI 工具.
• Windy - 将 HTML 元素转换为 Tailwind CSS 的浏览器扩展.
• react-native-tailwindcss - React Native 类型系统.
• typed-tailwind - Tailwind CSS 的 TypeScript 类型.
• Gatsby Plugin - Gatsby 的 Tailwind CSS 集成.
• Gridsome Plugin - Gridsome 的 Tailwind CSS 集成.
• Alfred Workflow - 快速 Tailwind CSS 文档搜索应用程序.
• ng-tailwindcss - 用于将 Tailwind CSS 集成到 Angular-CLI 项目中的 CLI 工具.
• vue-cli-plugin-tailwind - 将 Tailwind CSS 添加到项目中的 Vue CLI 插件.
• Tailwind CSS Figma Kit - 适用于 Tailwind CSS 的 Figma 套件.
• Tailwind CSS Figma UI Design Kit - 适用于 Tailwind CSS 的 Figma UI 设计工具包.
• Tailwind CSS Figma Plugin - 集成 Tailwind CSS 的 Figma 插件.
• @nuxtjs/tailwindcss - 用于 NuxtJS 的 Tailwind CSS 模块，带有 PurgeCSS 和现代 CSS（预设 env 1）.
• preact-cli-tailwind - Preact 的 Tailwind CSS 集成.
• tailwind-classes-sorter - NPM 库，提供对 Tailwind CSS 类进行排序的实用程序.
• prettier-plugin-tailwind - 对班级列表进行排序的更漂亮的插件.
• tailwindcss-rails - 将 Tailwind CSS 与 Rails 的资产管道一起使用的 Gem.
• Zeplin Config & Class generator - 生成 Tailwind 配置的 Zeplin 扩展.
• @tailwindcssinjs/macro - 将 Tailwind CSS 类转换为 CSS-in-JS 库的对象的 Babel 宏.
• twin.macro - 在任何 CSS-in-JS 库中使用 Tailwind 类.
• tailwindcss-webpack-plugin - 开箱即用的 Tailwind CSS，支持“在 Devtools 中设计”模式并可视化 Tailwind CSS 配置.
• Tailwind Config Viewer - 用于可视化 Tailwind CSS 配置文件的本地 UI 工具.
• Laravel Form Components - 使用 Tailwind CSS 自定义表单的刀片表单组件.
• @ngneat/tailwind - Angular 的 Tailwind CSS 集成.
• Gust - 用于 WordPress 的拖放页面构建器.
• clb - clb（类列表生成器）是一个实用函数，它基于 Stitches 像 API.
• Inspect Flow - Tailwind CSS 的完整开发人员工具.
• twined-components - 样式化组件的扩展组件，它优先考虑在 Tailwind CSS 中使用的类名.
• re-tailwind - 生成 Tailwind 类的 ReasonML 实用程序.
• Protoship Codegen - 从 Sketch 设计创建基于 Tailwind CSS 的 HTML 和 CSS 的代码生成器.
• create-tailwind-plugin - Tailwind CSS 的插件脚手架.
• Maizzle - 使用 Tailwind CSS 进行快速电子邮件原型设计的框架.
• Tailwind Cheat Sheet - Tailwind CSS 类名称备忘单.
• Tailwind Cheat Sheet - Tailwind CSS 类名称在一个文件中.
• Tailwind Cheat Sheet - Tailwind CSS 类名称、变体和指令备忘单.
• Tailwind Cheat Sheet - 可搜索页面中的 Tailwind CSS 类名称.
• Tailwind Cheat Sheet - 可搜索界面中的 Tailwind CSS 实用程序类名称.

UI Libraries, Components & Templates

Legend：官方资源·库·组件·模板

• Tailwind UI - 使用 Tailwind CSS 制作的组件库.
• Headless UI - 完全没有样式，完全可访问的 UI 组件.
• VueTailwind - 使用 Tailwind CSS 的 Vue.js UI 库.
• Tailwind Elements - 大量免费组件，得益于 Bootstrap 5，移动设备友好.
• Vechai UI - 使用 Tailwind CSS 的内置深色模式的高质量可访问 React 组件.
• Flowbite - 使用 Tailwind CSS 构建的开源组件库.
• a17t - 为扩展 Tailwind CSS 而构建的原子设计工具包.
• tails-ui - 使用 Tailwind CSS 的 React UI 库.
• tails - 使用 Tailwind CSS 手工制作的模板和组件.
• Svelte Headless UI - Headless UI 的非官方 Svelte 端口.
• TailBlocks - 60 多种可供使用的 Tailwind CSS 块.
• Tailwind Components - 社区驱动的 Tailwind CSS 组件存储库.
• Tailwind Toolbox - 模板、组件和资源.
• Meraki UI Components - 支持 RTL 语言的精美 Tailwind CSS 组件.
• Tailwind Cards - 越来越多的文本/图像卡集合.
• Tailwind Templates - 模板和组件的集合.
• Treact - 使用 Tailwind CSS 构建的 React UI 模板和组件.
• Jakarta LTE - 使用 Tailwind CSS 的管理模板.
• themes.dev - 手工制作、免费和优质的 Tailwind CSS 主题和组件.
• Kutty - Web 应用程序中常用的可访问和可重用组件.
• Sail UI - 基于 Tailwind CSS 构建的基本 UI 组件的集合.
• jQuery Toggler - 使用 jQuery 和 Tailwind CSS 切换.
• Tailwind Kit - 与框架无关的、Vue.js、React 和 Angular 组件.
• lofi ui - 低保真 Tailwind CSS 组件.
• Gust UI - 用于 React 和 HTML 中的 Web 应用程序的时尚 Tailwind CSS 组件.
• Windstrap - 带有 Bootstrap JS 的 Tailwind CSS.
• WickedBlocks - 使用 Tailwind CSS 构建的 120 多个布局块和组件的集合.
• Daisy UI - Tailwind CSS 的 UI 组件.
• Kometa UI Kit - 使用 Tailwind CSS 构建的免费多用途 UI 套件.
• Mamba UI - 免费的 Tailwind CSS 组件、部分和模板.
• Litepie Date picker - Vue.js 和 Tailwind CSS 的日期范围选择器组件.
• Tailwind Datepicker - 添加一个使用 Tailwind CSS 和 vanilla JavaScript 构建的日期选择器组件.
• Tailwind Typeahead - 使用 Vue.js 和 Tailwind CSS 构建的 Typeahead/Autocomplete 组件.
• Material Tailwind - 易于使用的 Tailwind CSS 和 Material Design 组件库.
• Layouts for Tailwind - Tailwind CSS 的布局和 UI 模式.
• HyperUI - 开源营销和电子商务 Tailwind CSS 组件.
• Snippets - 为 Tailwind CSS 制作的开源动画片段集合.
• Fancy Tailwind - 大量 Tailwind CSS UI 组件 (700+).
• Myna UI - 使用 Tailwind CSS 制作的开源 UI 组件和营销元素.
• Vue Notus - 开源 Tailwind CSS 和 Vue.js UI 套件.
• Red Pixel Themes - 使用 Tailwind CSS 制作的对开发人员友好的付费模板.
• EasyTailwind - 使用 Tailwind CSS 制作的免费增值模板，可轻松自定义.
• Windmill Dashboard - 多主题、完全可访问的仪表板模板.
• Tailwind Admin - 带有 Tailwind CSS 的管理面板模板.
• Landing Gradients - 使用渐变的登陆页面模板（1.7+）.
• Resume - 使用 Tailwind CSS 的简单简历.
• Resume - 使用 Tailwind CSS 构建的风格化简历模板，具有漂亮的英雄图案背景和自定义字体.
• Simple Light - 使用 React 和 Tailwind CSS 构建的免费登陆页面模板.
• V-Dashboard - 使用 Vue 3 和 Tailwind CSS 构建的仪表板起始模板.
• Petra - 使用 Nuxt.js 和 Tailwind CSS 构建的免费登陆页面模板.
• Tailmin - 使用 Vue.js 和 Tailwind CSS 构建的管理仪表板.
• OhMySMTP Templates - 使用 Maizzle 构建的事务性 HTML 电子邮件模板集
• Material Tailwind Kit React - 免费的 Tailwind CSS 和 React UI 工具包.
• Material Tailwind Dashboard React - 免费的 Tailwind CSS 和 React 管理模板.
• Admin One Vue 3 - 免费的 Vue.js 3 Tailwind CSS 管理模板，支持 Vite 和 Vue CLI.
• Cruip - 设计精美的 HTML、React 和 Vue.js 模板.

Starters & Themes

Legend：包·命令行工具/生成器·可克隆

• Create React App with PurgeCSS - 添加 Tailwind CSS 和 PurgeCSS 的 CRA 脚本.
• Laravel Preset - 将 Tailwind CSS 添加到 Laravel 框架.
• Laravel Front-end Preset - 使用 Tailwind CSS for Laravel 的前端预设.
• Laravel Dark Front-end Preset - 使用 Tailwind CSS for Laravel 的深色主题前端预设.
• Create React App with EmotionJS - 使用 Tailwind CSS 和 Emotion JS 的 CRA 样板.
• Create React App with TypeScript - 支持 Tailwind CSS 和 TypeScript 的 CRA 模板.
• Next.js PWA – 生成 Next.js PWA 的样板代码以及 Tailwind CSS 集成的 CLI.
• new-tailwind-app - 创建 React.js、Next.js、Gatsby.js、Vue3、Laravel 和基本的 Tailwind CSS 应用程序.
• Tailwind CSS Boilerplate - 使用 Parcel 的 Tailwind CSS 样板.
• Jekyll Starter - 使用 Tailwind CSS 的 Jekyll 启动器.
• Jekyll Starter - 使用 Tailwind CSS 的 Jekyll 启动器.
• Jekyll Starter - 使用 Tailwind CSS 的 Jekyll 启动器
• Gulp Starter - 使用 Tailwind CSS 的 Gulp 启动器.
• Gatsby Starter - 使用 Tailwind CSS 的 Gatsby 启动器.
• Gatsby Starter Simplicity - 使用 Tailwind CSS 的 Gatsby 启动器.
• Gatsby Starter + TypeScript - 使用 Tailwind CSS 和 TypeScript 的 Gatsby 启动器.
• Gatsby Starter + Emotion JS - 使用 Tailwind CSS 和 Emotion JS 的 Gatsby 启动器.
• Gatsby Starter Opinionated - Gatsby starter 使用 Tailwind CSS 和自以为是的好东西.
• Create React App Boilerplate - 使用 Tailwind CSS 的 CRA 样板.
• Create React App with PurgeCSS + Autoprefixer + CSSNano - 使用 CSS Nano 的 CRA 样板.
• Dogpatch - 使用 Webpack、Vue、Babel 和 Tailwind CSS 的 WordPress 启动器.
• Next.js Starter - 使用 Tailwind CSS 的 Next.js 样板.
• Sapper & Svelte Starter - 使用 Sapper、Tailwind CSS、Purge CSS、Prettier 和 ESLint 的 Svelte 样板.
• Netlify Lambda Starter - 使用 Tailwind CSS 的 Netlify Lambda 样板.
• Hugo Theme Starter with Tailwind CSS - 使用 Tailwind CSS 的 Hugo 主题启动器.
• Eleventy Web Starter - 使用 Eleventy、Tailwind CSS、Webpack 和 PostCSS 的入门工具包.
• Nanoc Starter - 使用 Tailwind CSS 的 Nanoc 启动器.
• PostCSS and Browsersync Boilerplate - 使用 CSS Nano 的样板.
• ParcelJS + TypeScript Boilerplate - 使用 Tailwind CSS、ParcelJS 捆绑器和 TypeScript 的样板.
• VuePress Tailwind CSS Starter - 使用 Tailwind CSS 的 VuePress 启动器.
• Gatsby Serif - 使用 Tailwind CSS 的 Gatsby 的衬线主题.
• Seminyak Hugo Theme - 使用 Tailwind CSS 的 Hugo 主题.
• Eleventy Starter - 使用 Tailwind CSS 的生产就绪、对 SEO 友好的博客启动器.
• Vite + React + Tailwind Starter - 使用 Vite、React 和 Tailwind CSS 的样板.
• Vite + React + TypeScript + Tailwind 3.x starter - Vite、React + Tailwind 3.x + TypeScript 的 GitHub 模板.
• Vite + Vue 3.x + Tailwind 2.x Starter - 使用 Vite、Vue、Vue Router 和 Tailwind CSS 的入门模板.
• Shopify Theme Lab - 使用 Vue 和 Tailwind CSS 的 Shopify 主题开发入门.
• Starter Dashboard Layout - 使用 Tailwind CSS 和 Alpine JS 的仪表板布局.
• Jekyll Landing Website Starter - 使用 Jekyll 和 Tailwind CSS 的生产就绪、SEO 友好、高性能登陆网站样板.
• Next JS Boilerplate - Next.js 和 Tailwind CSS 的样板.
• Vitailse - 带有 Vue 3、TypeScript 和 Tailwind CSS 的 Opinionated Vite 入门模板.
• Vite-Boot - Vite + Vue3 + TypeScript + Vue-Router4 + Pinia + Tailwind CSS + VueUse 模板.

Open-Source Projects

• Goodwork - 项目管理和协作工具.
• Statusfy - 使用 Tailwind CSS 的状态页面系统.
• Todolist - 使用 Tailwind CSS 的待办事项列表应用程序.
• LeagueStats - 英雄联盟玩家统计网站.
• SapperCommerce - 使用 Svelte 和 Tailwind CSS 的电子商务店面.
• Misiki Books - 使用 Vue + Moltin + Tailwind CSS 的书店.
• Ubuntu 20.04 - 使用 React.js + Tailwind CSS 的 Ubuntu 桌面.
• Angular Spotify - 使用 Angular、Nx Workspace 和 Tailwind CSS 构建的 Spotify 客户端.
• GitProfile - 基于 GitHub 配置文件的自动投资组合构建器，使用 React.js 和 Tailwind CSS 构建.

Learning

Legend：官方资源·示例·设置教程·视频教程·组件或页面教程·演员表

• Plugin Examples - 官方插件示例.
• Tailwind Dark Mode Theme Switcher - 使用 CSS 自定义属性和 Tailwind CSS 切换主题.
• Acquia - Acquia 的托管仪表板使用 Vue.js 和 Tailwind CSS 重建.
• Navbar - 使用 Vue.js 和 Tailwind CSS 制作的导航栏.
• Toggle switch - 使用 Tailwind CSS 切换.
• “Open” landing page - Cruip 使用 Tailwind CSS 样板构建的“打开”登录页面模板.
• Testing Tailwind CSS plugins with Jest - 如何使用 Jest 测试 Tailwind CSS 插件.
• Tailwind CSS with Webpack 4 and PostCSS - 如何使用 PostCSS 和 Webpack 设置 Tailwind CSS.
• Tailwind CSS with CSS-in-JS - 如何在 CSS-in-JS 中使用 Tailwind CSS.
• Tailwind CSS in a Laravel Project - 如何在 Laravel 项目中设置 Tailwind CSS.
• Tailwind CSS with Ember - 如何将 Tailwind CSS 添加到 Ember 应用程序.
• Sage WordPress theme and Tailwind CSS - 如何在 Sage 中设置 Tailwind CSS.
• Tailwind CSS with GatsbyJS - 如何在 Gatsby 中使用 Tailwind CSS.
• Tailwind CSS with Phoenix 1.4 - 如何在 Phoenix 1.4 中设置 Tailwind CSS.
• Extend Tailwind CSS - 如何扩展 Tailwind CSS.
• Web2Tailwind - 如何使用 AlpineJS 使用 Tailwind CSS 构建 Web 组件.
• Rebuilding Laravel.io - 使用 Tailwind CSS 重建 Laravel.io.
• Rebuilding Coinbase - 使用 Tailwind CSS 重建 Coinbase [see the Codepen].
• Rebuilding Twitter - 使用 Tailwind CSS 重建 Twitter [see the CodePen].
• Rebuilding YouTube - 使用 Tailwind CSS 重建 YouTube.
• Rebuilding Netlify - 使用 Tailwind CSS 重建 Netlify.
• Rebuilding Resolute - 使用 Tailwind CSS 重建 Resolute.
• Let’s Build: Movie Production Landing Page - 使用 Tailwind CSS 构建电影制作登陆页面.
• Lets Build: Responsive Navbar - 使用 Tailwind CSS 构建响应式导航栏.
• Let’s Build: Dribbble Shot - 使用 Tailwind CSS 进行运球投篮.
• Tailwind CSS: From Zero to Production - Complete walkthrough of Tailwind CSS, from installation to optimization for deployment.
• Let’s Build: Tweet component - 使用 Tailwind CSS 构建 Tweet 组件.
• Modal Dialog - 使用 Tailwind CSS 创建模式对话框.
• Building real-world UIs using Tailwind CSS - 构建 Shopify、Spotify、Netlify 和 Atlassian 的 UI.
• Rebuilding FreshBooks - 使用 Tailwind CSS 重建 FreshBooks.
• Login Page (PingPing) - 使用 Tailwind CSS 创建登录页面.
• Login Page - 使用 Tailwind CSS 创建登录页面.
• Vue.js Component with Tailwind and Laravel - 在 Laravel 项目中构建 Vue.js 组件.
• Vue.js Modal - 使用 Tailwind CSS 和 Vue.js 构建可自定义的模式.
• Navigation - 使用 Tailwind CSS 构建导航.
• Forms with Tailwind CSS - 如何使用 Tailwind CSS 设置表单样式.
• Photo gallery with CSS grids - 使用 CSS 网格和 Tailwind CSS 构建照片库.
• Rebuilding Bartik - 使用 Vue.js 和 Tailwind CSS 重建 Bartik（Drupal 的默认主题）.
• Rebuilding Airbnb’s Home Page - 使用 Tailwind CSS 重建 Airbnb 的主页.
• Typographic defaults in Tailwind CSS
• Create a responsive navigation menu in Tailwind CSS
• Laracasts Weekly Stream: Tailwind
• More experimentation with Tailwind CSS
• Rebuilding Spotify
• Rebuilding Discord
• Rebuilding Meetup