선

여백(Spacing)을 다루는 3가지 방법

· 2025-07-17 (목) 16:34:37 · 817

요소 간 간격은 최소 8px 단위로 통일하기 (8px 그리드 시스템)
- 버튼, 카드, 텍스트 사이의 간격을 4px, 7px처럼 제각각 쓰면 디자인이 불안정해 보임
- 8px, 16px, 24px처럼 일관된 간격만 사용 → UI가 깔끔해짐

 

내부 여백(padding)과 외부 여백(margin)을 구분해서 쓰기
- padding: 안쪽 여백 (텍스트와 버튼 테두리 사이)
- margin: 바깥 여백 (다른 요소와의 간격)
→ 잘 구분해서 써야 레이아웃이 안정됨

 

여백이 많을수록 ‘고급스러움’이 생긴다
- 좁은 여백 = 촘촘하고 답답함
- 넓은 여백 = 여유 있고 세련된 느낌
→ 과감하게 공백을 주는 것도 디자인인것 같습니다.


 

|
댓글을 작성하시려면 로그인이 필요합니다.

디자이너팁

377건

디자인과 관련된 유용한 정보를 공유하세요. 질문은 상단의 QA에서 해주시기 바랍니다.

+
제목 글쓴이 날짜 조회
25-12-27 조회 503
25-12-17 조회 502
25-11-30 조회 582
25-11-20 조회 547
25-10-10 조회 750
25-08-01 조회 701
25-08-01 조회 760
25-07-23 조회 795
25-07-17 조회 818
25-07-09 조회 822
25-06-26 조회 891
25-06-26 조회 730
25-06-10 조회 833
25-06-07 조회 828
25-02-03 조회 1,570
25-01-08 조회 1,188
24-10-21 조회 1,730
22-12-26 조회 6,116
22-09-28 조회 4,115
22-07-01 조회 3,080
22-06-14 조회 3,272
22-05-13 조회 2,832
22-04-28 조회 3,089
22-04-28 조회 2,825
22-02-09 조회 4,789
21-09-29 조회 5,172
21-08-27 조회 4,810
21-07-02 조회 2.1만
21-06-23 조회 5,449
21-06-21 조회 4,710