
https://youtu.be/NsR7f1OZeSY 타이포그래피 | FlutterFlow University ️디자인 시스템에서 타이포그래피 설정하기 테마 설정에서 'typography and icons'으로 가서 프라이머리 및 세컨더리 폰트 패밀리를 설정한다. 원하는 폰트를 구글 폰트에서 선택하거나 커스텀 폰트를 업로드하여 추가할 수 있다. 폰트를 추가한 후에는 각 타입 웨이트에 대한 옵션을 작업해야 한다. FlutterFlow에서는 실시간으로 렌더링하기 때문에 작업 과정에서 실제 타입을 확인할 수 있다. ️타이포그래피 설정하기: 글자 크기, 자간, 기울임, 색상, 반응형 타이포그래피 설정의 첫 번째 단계는 타입 스케일을 설정하는 것입니다. 이는 각 옵션별 글꼴 크기를 말합니다. 타이포그래피 스케일을 ..

색상 | 가져오기, AI 생성, 테스트 | FlutterFlow University 디자인 시스템의 색상 설정 방법 및 색상 유형 '테마 설정'에서 '색상'을 클릭하여 색상을 설정할 수 있다. 색상을 가져오거나 색상 팔레트를 생성하고 테스트하는 세 가지 방법이 있다. Figma나 다른 디자인 시스템에서 이미 가져왔다면 해당 색상이 표시될 것이다. 만약 가져오지 않았다면 브랜드 가이드라인에 맞게 색상을 수정하거나, 필요한 색상을 추가할 수 있다. 색상은 브랜드 색상, 유틸리티 색상, 액센트 색상, 시맨틱 색상, 그리고 사용자 정의 색상으로 구분된다. 플러터로 라이트 모드와 다크 모드에 대비하여 색상을 설정하는 방법 라이트 모드에서 설정한 색상들을 다크 모드에 복제한다. 유틸리티 색상을 제외하고 동일하게 설..

피그마 가져오기 | FlutterFlow 대학 ️️ Figma에서 디자인에 대한 색상과 타이포그래피를 가져오는 방법 Figma에서 디자인에 대해 기본 설정을 해야 색상과 타이포그래피를 가져올 수 있으며, 이를 올바르게 설정해야 한다. 기본적으로 Figma는 디자인에서 타입 스타일과 색상을 생성하지 않는다. FlutterFlow를 사용하여 가져올 것은 디자인의 텍스트 스타일과 색깔 스타일이다. 포토샵 디자인 시스템에 오브젝트 디자인 관련 작업법 소개 디자인에서 발견한 로컬 스타일을 그대로 적용하면, 오브젝트와 함께 스타일이 금방 추가된다. 오브젝트를 선택한 후, 색깔 채우기를 클릭해 디자인에서 추가된 로컬 스타일을 확인한다. 이것을 디자인 시스템에 추가한 후, 이름과 스타일을 설정하여 디자인 시스템에 적용..