Typography
타이포그래피는 텍스트를 읽기 쉽고 아름답게 표현하는 시각적 체계로 폰트 선택, 크기, 굵기, 행간, 자간 등의 요소들을 조합하여 정보의 위계와 가독성을 만들어냅니다. 원티드랩에서는 일관된 타이포그래피 규칙을 통해 브랜드의 목소리를 전달하고 사용자 경험을 향상시킵니다.
원티드랩에서는 일본어 서비스도 함께 대응하기 때문에, One Design System에서 기본 글꼴로 한국어, 영어, 일본어를 지원하는 Pretendard JP를 사용하고 있습니다.
원티드랩에서는 개발 시 텍스트가 음절별로 나뉘어서 줄바꿈이 됩니다. 따라서 디자인을 하며 별도로 줄바꿈을 하지 않아도 괜찮습니다.
| 명칭 | 크기 | 행간 | 자간 |
|---|
| Display 1 | 56px | 72px (1.286) | -0.0319em |
| Display 2 | 40px | 52px (1.3) | -0.0282em |
| Display 3 | 36px | 48px (1.334) | -0.027em |
| Title 1 | 32px | 44px (1.375) | -0.0253em |
| Title 2 | 28px | 38px (1.358) | -0.0236em |
| Title 3 | 24px | 32px (1.334) | -0.023em |
| Heading 1 | 22px | 30px (1.364) | -0.0194em |
| Heading 2 | 20px | 28px (1.4) | -0.012em |
| Headline 1 | 18px | 26px (1.444) | -0.002em |
| Headline 2 | 17px | 26px (1.412) | 0em |
| Body 1/Normal | 16px | 24px (1.5) | 0.0057em |
| Body 1/Reading | 16px | 26px (1.625) | 0.0057em |
| Body 2/Normal | 15px | 22px (1.467) | 0.0096em |
| Body 2/Reading | 15px | 24px (1.6) | 0.0096em |
| Label 1/Normal | 14px | 20px (1.429) | 0.0145em |
| Label 1/Reading | 14px | 22px (1.571) | 0.0145em |
| Label 2 | 13px | 18px (1.385) | 0.0194em |
| Caption 1 | 12px | 16px (1.334) | 0.0252em |
| Caption 2 | 11px | 14px (1.273) | 0.0311em |