KKRDS

정부 누리집 같은 공공 안내형. 흰 머리와 아래 선, 「전체 메뉴」, 회색 안내 상자, 넉넉한 줄 간격. — 20개 항목

원래 이름: 대한민국 정부 디자인 시스템(KRDS)
라이선스: 공공누리 제1유형(출처표시) · 글꼴 Pretendard GOV(OFL)
원본: partnerscoupang-sites design-systems@22083bd · 데이터 babyfood
출처 표기: 본 저작물은 행정안전부에서 2024년 작성하여 공공누리 제1유형으로 개방한 ‘범정부 UI/UX 디자인시스템(KRDS)’을 이용하였으며, 해당 저작물은 ‘KRDS 디자인시스템 홈페이지(www.krds.go.kr)’에서 무료로 다운받으실 수 있습니다. www.krds.go.kr

팩 나란히 보기 →

01사이트 머리Site header

흰 바탕 위 얇은 회색 아래 선, 지금 주제는 진한 글자와 굵은 밑줄로 표시해요. 정부 누리집에서 보던 그 머리예요.

02사이트 발Site footer

옅은 회색 바탕에 세로로 넉넉히 쌓이는 푸터예요. 링크 중에는 개인정보처리방침만 굵고, 출처 문구는 밑줄 링크로 길게 들어가요.

03현재 위치Breadcrumbs

작은 회색 글자로 「홈 > 주제 > 글」을 이어요. 꺾쇠 아이콘이 KRDS 기본이고, 빗금 변형은 더 조용해요.

04주제·안내 페이지 머리Page head

큰 굵은 제목 아래 설명과 글 수가 오고, 그 옆에 다른 주제로 가는 길이 붙는 머리예요. 띠 변형은 회색 바탕에 파란 칩, 띠 없는 변형은 밑줄 링크 한 줄이에요.

05없는 페이지(404)Not found (404)

가운데 정렬 없이 왼쪽으로 정렬한 404 예요. 파란 홈 버튼 아래에 번호 붙은 글 목록이 이어져요.

06홈 머리Home hero

그림 없이 글과 링크로만 시작하는 홈 머리예요. 큰 제목, 출처를 밝히는 한 줄, 그리고 읽을 글이나 주제 목록이 따라와요.

07주제 목록Topic index

주제마다 위쪽에 회색 선을 긋는 주제 목록이에요. 주제마다 제목과 설명, 그리고 글 몇 편 또는 글 수가 붙어요.

08함께 보는 사이트Related sites

「함께 보는 육아 사이트」를 파란 모노그램 표식과 이름으로 보여 줘요. 사이트마다 색을 달리하지 않아요.

09허브 사이트 목록Hub directory

사이트를 아기 시기 순서(출산 전 → 100일 → …)로 늘어놓은 목록이에요. 시기마다 번호가 붙고, 목록·표에서는 파란 글자, 세로 단계에서는 네모 안 글자예요.

10글 머리Post header

제목과 요약 아래에 「기관 자료 6곳과 대조 · 마지막 확인」을 두고, 대가성 문구는 테두리 상자에 작지만 읽히는 글씨로 조용히 넣어요.

11핵심 요약Summary

글 맨 위 핵심 요약이에요. 모서리 둥근 옅은 회색 상자에 파란 체크가 붙고, 상자 없이 굵은 번호를 회색 선으로 나누거나, 첫 줄만 굵고 크게 쓰는 모양도 있어요.

12목차Table of contents

목차는 오른쪽 「이 페이지의 구성」 목록이 기본이에요. 칩 변형은 모든 폭에서 칩 줄로 보여 줘요.

13본문Body text

본문을 넉넉한 글자 크기와 줄 간격으로 읽게 하고, 표·타임라인·체크리스트·인용에 모양을 입혀요. 변형은 선과 상자의 양이 달라요.

14위급도 안내Care guide

「이럴 땐 병원에 가요」 안내예요. 바로 119 카드는 굵은 검은 테두리, 일반 진료 카드는 얇은 회색 테두리예요.

15출처 상자Trust box

「참고한 자료와 확인」을 옅은 회색 둥근 상자의 번호 목록, 번호 없는 위아래 선 표, 작은 각주 목록 세 가지로 보여 줘요. 출처마다 확인일이 붙어요.

16자주 묻는 질문FAQ

테두리 상자 안에 질문 줄을 쌓고 꺾쇠로 펼쳐요. 모두 펼친 변형은 질문 앞 파란 「Q」, 답 앞 「A」예요.

17추천 준비물Product list

추천 준비물을 광고처럼 튀지 않게 보여 줘요. 위에 테두리 있는 대가성 문구 상자가 먼저 오고, 링크는 조용한 버튼이나 파란 글자예요.

18글 카드Post card

게시판 목록처럼 선으로 나뉜 줄이에요. 파란 주제 글자, 굵은 제목, 설명, 날짜 순이고 대표 글은 테두리 상자로 커져요.

19글 목록Post list

번호 붙은 글 줄을 위에 회색 선을 두고 이어 붙인 목록이에요. 넓은 자리에서는 두 열로 나뉘어요.

20이전·다음 글Pager

이전 글과 다음 글을 보여 줘요. 두 변형은 테두리 상자 둘, 또는 게시판 「이전 글 / 다음 글」 줄이에요.