bar는 한 줄이에요. 왼쪽에 이름, 오른쪽에 메뉴가 놓이고 메뉴 칸 하나가 띠 높이만큼 꽉 차요. 폰에서는 왼쪽 메뉴 단추를 눌러 옆 메뉴를 열어요. stacked는 검은 띠 아래에 회색 줄을 하나 더 두고 주제 탭을 올려요. 검은 띠에는 이름과 한 줄 소개가 같이 들어가고, 폰에서도 탭이 펼침 없이 옆으로 밀려요. compact는 오른쪽 「전체 메뉴」 단추 하나만 남기고, 누르면 검은 패널에 주제마다 설명과 글 수가 나와요.
주제가 네다섯 개로 적고 이름이 짧으면 bar가 가장 단순해요. 주제가 많거나 설명을 같이 보여 주고 싶으면 stacked나 compact가 맞아요. 어느 쪽이든 밝은 화면에서는 가장 어두운 면이라, 밝고 부드러운 분위기의 육아 사이트에는 무겁게 느껴질 수 있어요. 다크 모드에서는 본문 바탕과 같은 색이라 아래 가는 선으로만 구분돼요.
이름 자리는 Carbon의 「Header name」 자리를 따랐고, IBM 글자나 로고는 넣지 않았어요.
이럴 때 — 변형 3
- bar한 줄 주제가 3~5개라 이름 옆 한 줄에 다 들어갈 때. 폰에서는 메뉴를 펼쳐서 본다.쓰는 사이트 3곳: babyplay, babysick, feeding
- stacked두 줄 주제 탭을 늘 보여 주고 싶을 때 — 폰에서도 접지 않고 옆으로 밀어 본다.쓰는 사이트 4곳: babyfood, toddlerfood, vaccination, 허브
- compact전체 메뉴 주제가 많거나 주제마다 한 줄 설명·글 수를 보여 주고 싶을 때.쓰는 사이트 4곳: babysleep, birthprep, milestone, newborn