inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

디자인 시스템 with 피그마

헤더 (Header part02)

Chips 타입의 Radius 값 관련해서 문의드립니다!

해결된 질문

695

admin

작성한 질문수 2

1

범쌤님 좋은 강의 만들어 주셔서 감사합니다!

아예 둥근 Chips 형태의 경우엔 Radius 값을 주는 기준이 있을까요? 보통 큰 값을 입력하여 둥근 형태가 될 수 있게 하는데 기준이 없다보니 컴포넌트마다 적용되는 Radius 값이 상이하여 질문드리게 되었습니다.

figma 디자인-시스템 아토믹-디자인 아토믹-디자인 figma-tokens 디자인 시스템

답변 1

3

범쌤

안녕하세요 admin 님 :)

굉장히 좋은 질문을 주신것 같습니다.

정확하게 계산을 통해 한다면,
가로가 긴 네모의 경우 높이의 절반값을 radius 를 주면 정확히 pill(알약)모양을 만들 수 있습니다.
세로가 긴 네모의 경우 좌우의 절반값을 radius 로 주면 정확히 pill ui 를 그릴 수 있습니다.

ex) 100 x 20 짜리 직사각형 radius:10
ex) 30 x 200 짜리 직사각형 radius: 15

영상에선 다루지 않았지만, radius또한 TokensStudio(FigmaTokens)에 등록하여 사용하시면 보다 체계적인 시스템을 유지할 수 있습니다.

감사합니다 :)

0

admin

가로세로 중 짧은 길이의 절반값을 주면 되는 거군요. 답변 감사합니다!

borderTransparent를 라이트/다크모드에 이중등록

0

30

2

해결되었습니다.

0

24

1

안녕하세요! 강의잘 들었습니다.

0

77

2

타이포그래피 16 -> 14 변경 시 XXXL만 변경 안 됨

0

49

2

토큰스튜디오에서 폰트 스타일등록 문의

0

65

2

토큰에서 style로 export시 에러

0

71

2

컬러시스템 등록 관련

0

72

2

토큰 light/dark mode 오류

0

67

2

Pretendard 없으면 에러납니다

0

232

2

폰트 토큰 작업 할때

1

99

3

여기 수업에서 엘로우나 레드나 블루 이런 컬러들을 다양하게 만드는 이유가 뭔가요?

0

57

2

토큰을 깃허브에 올리는 방법이 없어진거 같은데요

1

82

2

토큰 export 할때 어떻게 해야 하나요? 버전이 바뀌어서 그런지 못찾겠어요

0

212

2

인프런 할때마다 짜증나는데 수업내용이 너무 오래된건 제발 삭제좀 하던지 다시 찍던지 해주세요

1

79

1

tailwind color generator 이게 작동이 잘 안되네요

0

75

2

figma tokens플러그인 안나오는데요??

0

125

2

혹시 토큰 가공할 수 있는 강의도 따로 있을까요??

1

55

2

피그마 배리어블에 export시 값 저장 안됨

0

207

3

Style - variable 문으ㅣ ㅜㅜ

0

69

2

borderTransparent 임포트가 안됩니다

1

69

2

화면이 보이지가 않아요?

0

67

1

컬러맵핑하고 라이트/다크 모드 설정시 색상 반전이 안돼요 ㅠㅠ

1

271

2

피그마 토큰 플러그인

1

292

2

깃허브 sync 오류

1

193

2