본문 바로가기
UX 콜렉션/폰트

원티드 산스(Wanted Sans) 폰트 (무료 폰트 다운로드)

반응형

 

Wanted SansWanted Dev에서 설계한 모던하고 다재다능한 서체입니다. 이 폰트는 명확하고 가독성이 뛰어나며, 디지털 인터페이스부터 인쇄 디자인에 이르기까지 다양한 용도로 사용하기에 적합합니다. 깨끗한 선과 기하학적인 형태가 특징인 이 폰트는 현대적인 느낌을 필요로 하는 프로젝트에 이상적인 선택입니다.

Wanted Sans의 주요 특징:

  • 모던한 디자인: Wanted Sans는 헤드라인과 본문에 모두 적합한 깨끗하고 미니멀한 디자인이 특징입니다.
  • 다양한 용도: 웹 디자인, 브랜딩, 인쇄 등 다양한 용도에 적합합니다.
  • 오픈 소스: 이 폰트는 오픈 소스로 제공되어 개발자와 디자이너가 자유롭게 사용하고 커스터마이징할 수 있습니다.

Wanted Sans를 웹폰트로 사용하는 방법

Wanted Sans를 웹폰트로 사용하려면 다음 단계를 따르세요:

1. 폰트 파일 다운로드

먼저 GitHub 저장소에서 폰트 파일을 다운로드합니다. 웹 사용에 적합한 .ttf 또는 .woff 형식의 다양한 폰트 웨이트와 스타일을 찾을 수 있습니다.

2. 로컬에 폰트 호스팅

다운로드한 폰트 파일을 프로젝트 내의 디렉토리에 배치해 로컬에서 호스팅합니다. 예를 들어, fonts/라는 디렉토리에 폰트 파일을 저장합니다.

3. CSS에 폰트 포함

웹 프로젝트에서 폰트를 사용하려면 CSS 파일에 @font-face 규칙을 사용해 선언해야 합니다. 아래는 폰트를 포함하는 예시입니다:

@font-face {
  font-family: 'Wanted Sans';
  src: url('/fonts/wanted-sans-regular.woff2') format('woff2'),
       url('/fonts/wanted-sans-regular.woff') format('woff'),
       url('/fonts/wanted-sans-regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Wanted Sans';
  src: url('/fonts/wanted-sans-bold.woff2') format('woff2'),
       url('/fonts/wanted-sans-bold.woff') format('woff'),
       url('/fonts/wanted-sans-bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}

/* 이탤릭 스타일 예시 */
@font-face {
  font-family: 'Wanted Sans';
  src: url('/fonts/wanted-sans-italic.woff2') format('woff2'),
       url('/fonts/wanted-sans-italic.woff') format('woff'),
       url('/fonts/wanted-sans-italic.ttf') format('truetype');
  font-weight: normal;
  font-style: italic;
}

4. 요소에 폰트 적용

@font-face를 사용해 폰트를 정의한 후, font-family 속성을 사용해 HTML 요소에 폰트를 적용할 수 있습니다:

body {
  font-family: 'Wanted Sans', sans-serif;
}

h1, h2, h3 {
  font-family: 'Wanted Sans', sans-serif;
  font-weight: bold;
}

p {
  font-family: 'Wanted Sans', sans-serif;
  font-weight: normal;
}

5. Google Fonts 대안 사용

폰트를 직접 호스팅하는 것을 피하고 싶다면, Google Fonts와 같은 웹 폰트 서비스를 사용하는 것도 고려할 수 있습니다. 폰트를 계정에 업로드한 후, @font-face 링크를 생성해 HTML에서 직접 사용할 수 있습니다.

Wanted Sans 사용의 장점:

  • 커스터마이징: Wanted Sans는 오픈 소스이기 때문에, 특정 필요에 맞게 폰트를 수정할 수 있습니다.
  • 라이선스 비용 없음: 오픈 소스 프로젝트로서, 개인 및 상업적 프로젝트에 라이선스 비용 없이 사용할 수 있습니다.
  • 넓은 브라우저 지원: @font-face 규칙은 Chrome, Firefox, Safari, Edge 등 최신 브라우저에서 폰트가 작동하도록 보장합니다.

이 단계를 따르면 Wanted Sans를 웹 프로젝트에 쉽게 통합할 수 있으며, 사이트에 모던하고 깔끔한 타이포그래피 스타일을 제공할 수 있습니다.

반응형
❤️ 외주/과외 문의
🖥️ 클라우드 메뉴판 : 디지털팝