EN/JA

zudo-css-wisdom

Flexbox & Grid Positioning Sizing Media Document Layout

Font Sizing Fonts Text Control

Color Effects Shadows & Borders

States & Transitions Selectors Scroll Accessibility

Architecture Design Tokens Custom Properties Design Principles

GitHub repository

Type to search...

to open search from anywhere

EN/JA

What is zudo-css?

css-wisdom Skill

Flexbox Patterns

CSS Grid Patterns

Centering Techniques

Positioning Guide

Stacking Context

Containing Block for position fixed

Anchor Positioning

fit-content, max-content, min-content

clamp() for Fluid Sizing

Logical Properties

Negative Margin Expand + Padding Back

Overflow Clip and Hidden

Letterbox Stage

Object Fit and Object Position

Responsive Images

Document Layout

Multi-Column Layout

Table Cell Width Control

Print and PDF Export

Fluid Font Sizing with clamp()

Three-Tier Font-Size Strategy

Screen-Width Based Font Size Definition

Line Height Best Practices

Stage-Proportional Typography

Font Loading Strategies

Japanese Font Family Specification

Noto Sans Webfont Guide

Text Overflow and Line Clamping

Vertical Rhythm

Text Wrap: balance and pretty

Prose Heading Spacing

Long URL and Path Wrapping

OKLCH Color Space

currentColor Patterns

Dark Mode Strategies

Color Palette Strategy

Three-Tier Color Strategy

Backdrop Filter and Glassmorphism

Clip-Path and Mask

CSS 3D Transforms

Text Outline and Stroke Effects

Gradient Techniques

CSS-Only Pattern Library

Shadows & Borders

Layered Natural Shadows

Border Techniques

Smooth Shadow Transitions

Container Queries

Fluid Design with clamp()

Media Query Best Practices

Responsive Grid Patterns

States & Transitions

Hover, Focus, and Active States

Transition Best Practices

View Transitions

The :has() Selector

:is() and :where() Selectors

Parent-State Child Styling

Scroll-Driven Animations

Overscroll Behavior

Form Control Styling

Touch Target Sizing

prefers-reduced-motion

Color Contrast and Accessibility

Component First Strategy

CSS Modules Strategy

Markdown to HTML Conversion Architecture

Design Token Lint

Two-Tier Size Strategy

Multi Namespace Token Strategy

Z-Index Strategy

Display Scale Strategy

Tight Token Strategy

Color Token Patterns

Typography Token Patterns

Component Tokens & Arbitrary Values

Spacing Architecture for Dense Desktop-Class Web Apps

Custom Properties

Custom Properties Pattern Catalog

Theming Recipes

Design Principles

Spacing Philosophy: Proximity Grouping

Color Usage Philosophy: The Accent Budget

Shape Language: Corner Radius Is a Brand Decision

Writing a Design Tone Spec an AI Agent Will Follow

l-demo-component

l-handle-deep-article

zudo-doc-design-system

zudo-doc-translate

zudo-doc-version-bump

EN/JA

INBOX

INBOX

Drafts and unsorted notes. Articles here will be moved to a proper category once reviewed.

Overview

Revision History

CreatedUpdated

Fundamentals

Tight Token Strategy
Component First Strategy
Three-Tier Color Strategy

Copyright © 2026 Takazudo. Built with zudo-doc. Enjoy synth on Takazudo Modular.