Design System
Visual design system, component showcase, and theme customization
Typography
Heading 1
Heading 2
Heading 3
Heading 4
Regular paragraph text with proper line height and spacing. This demonstrates how body text appears across the site.
Small text used for metadata, captions, and secondary information.
Extra small text for fine details and disclaimers.
Color Palette
Primary Colors
Gray Scale
Semantic Colors
Success
Warning
Error
Components
Type Colours
ArticlesTailwind colour name (e.g., green, orange, blue)
TechnicalTailwind colour name (e.g., green, orange, blue)
ThoughtsTailwind colour name (e.g., green, orange, blue)
Post Icons
🎨📝🚀
Date Formatting
Sep 1, 2025Aug 31, 2025Aug 2, 2025
Summary Rendering
This is a bold summary with inline code and regular text to demonstrate the rendering.
Buttons
Mixed Language Text
English text with proper spacing and baseline alignment.
中文文本的行高和字间距测试，确保与英文混排时的视觉效果。
日本語のテキストサンプル。ひらがな、カタカナ、漢字の混在。
Mixed: English, 中文, and 日本語 in the same paragraph for baseline testing.