Skip to main content

Tailwind CSS 디자인 시스템

유틸리티 우선 CSS로 아름다운 UI를 빠르게. 반응형, 다크모드, 커스텀 설정까지.

beginner8h8 modules
3
ConceptMembers only

Flexbox와 Grid 레이아웃

flex, grid 유틸리티로 복잡한 레이아웃을 쉽게 만드는 방법을 연습해요.

4
PracticalMembers only

반응형 디자인

sm, md, lg 브레이크포인트로 모바일 퍼스트 반응형 UI를 만들어요.

5
ConceptMembers only

다크 모드

dark: 변형자로 다크 모드를 구현하고 테마 전환 패턴을 배워요.

6
PracticalMembers only

상태 변형자와 애니메이션

hover, focus, group 변형자와 transition, animate 유틸리티를 활용해요.

7
ConceptMembers only

커스텀 설정

tailwind.config로 색상, 간격, 폰트를 커스터마이징하는 방법을 배워요.

8
PracticalMembers only

디자인 시스템 구축

재사용 가능한 컴포넌트 패턴과 일관된 디자인 시스템을 만들어요.

Want to study the remaining modules?

Sign up for free to access the full curriculum with AI tutor, quizzes, and code challenges.

Get Started Free