상세 컨텐츠

본문 제목

피그마(Figma):: 컬럼(Column) 그리드(Grid) 사용하기

Design/Figma

by 지유:D 2023. 8. 2. 10:44

본문

728x90
반응형

 

Grid 생성하기

> 우측 Layout grid에서 '+'버튼을 눌러주세요

그럼 포토샵처럼 그리드가 생성되는걸 확인 할 수 있습니다.

size그리드 크기를 선택하여 사이즈를 조절 할 수도 있습니다.

그리드의 단축키는 'CTRL +  SHIFT + 4'입니다.

 

컬럼만들기

http://gridcalculator.dk/

 

Grid Calculator by Nicolaj Kirkgaard Nielsen

 

gridcalculator.dk

컬럼을 계산해주는 사이트 입니다.

max-width를 1920으로 잡고 1400안에 맞는 그리드를 잡겠습니다.

위 그리드 생성과 똑같은 방식으로 진행해주시는데

 

셀렉트 박스를 눌러'columns'로 바꿔주세요.

 

*1400짜리의 PC버전 컬럼을 만든다는 기준으로 
Count : 12
Type : stretch
Margin : 260
Gutter : 40

 

1920화면에 1400grid를 생성했습니다!

컬럼도 똑같이 껐다키는 단축키는 CTRL+ SHIFT+4입니다.

728x90
반응형

관련글 더보기

댓글 영역