tailwind-patterns

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Tailwind CSS Patterns (v4 - 2025)

Tailwind CSS 设计模式(v4 - 2025版)

Modern utility-first CSS with CSS-native configuration.

基于CSS原生配置的现代实用优先CSS框架

1. Tailwind v4 Architecture

1. Tailwind v4 架构

🧠 Knowledge Modules (Fractal Skills)

🧠 知识模块(分形技能)

1. What Changed from v3

1. 与v3版本的差异

2. v4 Core Concepts

2. v4核心概念

3. Theme Definition

3. 主题定义

4. When to Extend vs Override

4. 扩展与覆盖的适用场景

5. Breakpoint vs Container

5. 断点与容器的区别

6. Container Query Usage

6. 容器查询用法

7. When to Use

7. 适用场景

8. Breakpoint System

8. 断点系统

9. Mobile-First Principle

9. 移动优先原则

10. Configuration Strategies

10. 配置策略

11. Dark Mode Pattern

11. 暗黑模式设计模式

12. Flexbox Patterns

12. Flexbox设计模式

13. Grid Patterns

13. Grid设计模式

14. OKLCH vs RGB/HSL

14. OKLCH与RGB/HSL对比

15. Color Token Architecture

15. 颜色令牌架构

16. Font Stack Pattern

16. 字体栈设计模式

17. Type Scale

17. 字体比例

18. Built-in Animations

18. 内置动画

19. Transition Patterns

19. 过渡效果设计模式

20. When to Extract

20. 代码提取的适用场景

21. Extraction Methods

21. 代码提取方法