Nemo
Cive Design System

Nemo

Cive가 만드는 모든 화면은 Nemo의 부품으로 지어요. 옛 컴퓨터 창처럼 단단하고 또렷한 화면을 같은 규칙으로 빠르게 만들기 위한 시스템이에요.

컴포넌트 보기기초부터 보기

세 가지 원칙

01

종이와 먹

종이색 바탕에 먹색 1px 선으로 그려요. 색은 보라 하나로 강조하고, 주황, 초록, 빨강은 뜻이 있을 때만 써요.

02

각진 네모

모서리는 언제나 0이에요. 떠 있는 것은 흐린 그림자 대신 딱딱한 먹색 그림자로 높이를 보여 줘요.

03

FOX와 같은 이름

컴포넌트 이름, 글자 크기, 굵기 규칙은 핀다 FOX와 1:1로 맞춰요. FOX를 아는 사람은 바로 찾을 수 있어요.

기초

색Color글자Typography간격Spacing모양Radius깊이Shadow선Stroke움직임Motion

컴포넌트

버튼Button칩Chip배지Badge토글Toggle체크박스Checkbox라디오Radio입력칸TextField탭Tab상단 바Navigation목록 줄ListRow진행 표시Progress빈 화면Empty카드Card팝업Popup바텀시트BottomSheet스낵바Snackbar툴팁Tooltip

네모네모 부품

옛 컴퓨터 창줄무늬 제목 줄점무늬 띠장 번호그림 상자

쓰는 규칙

말투UX Writing아이콘Icon