[Flutter] 폰트 적용하기

Flutter에서는 폰트를 적용하는 두 가지 방법

1. 커스텀 폰트 직접 적용하기
2. Google Fonts 패키지 사용하기

---

💁🏻 적용 가이드

정식 앱 출시 or 디자인 고정된 서비스라면 👉 직접 폰트 적용
프로토타입, 테스트, 빠른 개발이라면 👉 Google Fonts 사용

✅ 첫 번째 방법: 커스텀 폰트 직접 적용하기

디자인 시스템이나 브랜드 가이드에 맞춰 특정 폰트를 꼭 써야 할 때는 직접 폰트를 적용하는 방법이 가장 확실하다.

 

1. 폰트 파일 준비

• .ttf 또는 .otf 형식의 폰트 파일을 다운로드
• 프로젝트 내에 assets/fonts 폴더를 생성 후 폰트 파일 복사

예시 폴더 구조:

📁 assets
 └─ 📁 fonts
     ├─ Pretendard-Regular.ttf
     └─ Pretendard-Bold.ttf

 

2. pubspec.yaml에 폰트 등록하기

폰트를 사용할 수 있도록 pubspec.yaml 파일에 font-family 추가

flutter:
  fonts:
    - family: Pretendard
      fonts:
        - asset: assets/fonts/Pretendard-Regular.ttf
        - asset: assets/fonts/Pretendard-Bold.ttf

❗️주의: 들여쓰기(YAML 포맷) 맞춰주기 (스페이스 2칸)

 

3. 폰트 적용하기

전역 적용 (앱 전체에 폰트 사용)

MaterialApp(
  theme: ThemeData(
    fontFamily: 'Pretendard',
  ),
  home: HomeScreen(),
);

 

특정 텍스트에만 적용

Text(
  'Hello World',
  style: TextStyle(
    fontFamily: 'Pretendard',
    fontWeight: FontWeight.bold,
    fontSize: 20,
  ),
)

 

 

• flutter clean 후 다시 실행해보기
• pubspec.yaml 경로, 들여쓰기, 폰트 파일명을 다시 확인

 

✅ 두 번째 방법: Google Fonts 패키지 사용하기

Google Fonts에서 제공하는 다양한 폰트를 간편하게 불러와 사용할 수 있는 방법이 있다.

 

1. Google Fonts 패키지 설치

flutter pub add google_fonts

 

 

2. 폰트 적용하기

전역 적용 (앱 전체에 폰트 사용)

import 'package:google_fonts/google_fonts.dart';

MaterialApp(
  theme: ThemeData(
    textTheme: GoogleFonts.pretendardTextTheme(),
  ),
  home: HomeScreen(),
);

 

특정 텍스트에만 적용

Text(
  'Hello World!',
  style: GoogleFonts.pretendard(
    fontSize: 18,
    fontWeight: FontWeight.w600,
  ),
)

 

---

💡 폰트 적용 방식 정리

1. 직접 폰트 파일 적용 (커스텀)

추천 상황:

• 브랜드 전용 폰트를 사용해야 할 때 (예: Pretendard, NanumSquareNeo 등)
• 오프라인 앱이나 퍼포먼스가 중요한 앱
• 앱 배포 시 폰트 일관성과 안정성이 중요할 때

장점:

• 오프라인에서 동작 가능
• 원하는 폰트를 자유롭게 쓸 수 있음
• fontWeight로 굵기 자연스럽게 조절 가능

단점:

• 초기 설정이 약간 번거로움 (파일 추가, YAML 수정)

2. Google Fonts 패키지 사용

추천 상황:

• 다양한 폰트를 빠르게 테스트하거나 프로토타이핑할 때
• Google Fonts 범위 내에서 충분한 폰트가 있을 때
• 간단한 사이드 프로젝트나 샘플 앱

장점:

• 설정이 매우 간편 (설치 후 바로 사용)
• 다양한 구글 폰트를 코드 한 줄로 적용 가능

단점:

• 인터넷 연결 필요할 수 있음
• 외부 패키지 의존성 존재
• 굵기나 스타일이 제한적일 수 있음
• 환경에 따라 빌드가 안되는 경우가 있음