본문으로 바로가기

컴포넌트

UI Components

Badge

defaultsmbaselgxl
mutedsmbaselgxl
outlinesmbaselgxl

Button

primary
secondary
outline

TextInput

Textarea

Checkbox

Radio

sm
base
lg

Select / Combo

Modal

Dialog (Alert)

Typography

h1

아름다운 타이포그래피

h2

섬세한 디자인의 교차점

h3

UI 컴포넌트 시스템

h4

색상과 간격 토큰

h5
기술 스택 개요
subtitle

사람들이 실제로 즐겨 쓰는 제품을 만들기 위해, 깔끔한 엔지니어링과 섬세한 디자인의 교차점에서 일합니다.

Color Palette

danger
warning
info
success
light
dark
dangerwarninginfosuccesslightdark

Card

기본 카드

카드 컴포넌트의 기본 스타일입니다.

강조 카드

왼쪽 테두리로 중요도를 표현합니다.

다크 카드

어두운 배경 위의 카드입니다.

Breadcrumb

첫화면블로그글 제목

Horizontal Rule

또는

Table

← 가로로 스크롤하면 전체 내용을 볼 수 있어요
이름역할기술경력상태액션
김준호Frontend DevReact · TypeScript5년재직 중
이서연Backend DevNode.js · PostgreSQL3년협업 중
박민준DevOpsDocker · AWS7년휴직

Placeholder / Skeleton

Spinner

sm
base
lg
xl

Progress Bar

25%
50%
75%
100%

Range / Slider

sm30
base60
lg80

Button Group

Tab

풀스택 개발자로 사용자 경험을 중심에 두고 제품을 만듭니다. 아이디어에서 배포까지 전 과정을 경험했습니다.

Accordion

Pagination

Toast / Notification

저장되었습니다.
새로운 업데이트가 있습니다.
확인이 필요합니다.
오류가 발생했습니다.

Popover

Navigator

대시보드
프로젝트
팀원
설정

© 2026 Kim Zero. All rights reserved.

개인정보처리방침관리자