انگلیسی OFL متن بدنه

Fraunces

فونت Fraunces از خانواده سریف‌های کلاسیک است و سریف‌های ظریف و کنتراست متعادل حروف، به متن عمق و شخصیت می‌بخشد. برای متون بلند، وبلاگ‌های ادبی و طرح‌هایی که حس کلاسیک و معتبر می‌خواهند عالی است.

طراح: جامعه متن‌باز ۱۸ دانلود ۱۷۶ بازدید 9 وزن فرمت ttf + woff + woff2 مناسب متن بدنه مناسب طراحی مدرن

پیش‌نمایش زنده

کد آماده استفاده (فایل CSS + @font-face)

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-100.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-100.woff') format('woff');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-100.woff2') format('woff2');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-200.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-200.woff') format('woff');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-200.woff2') format('woff2');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-300.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-300.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-300.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-400.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-400.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-500.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-500.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-600.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-600.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-700.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-700.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-800.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-800.woff') format('woff');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-800.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-900.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-900.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'RadikalWP-fraunces';
  src: url('/assets/fonts/fraunces/fraunces-900.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
روش استفاده: فایل‌های فونت را در پوشه fonts/ پروژه‌تان قرار دهید، کد بالا را در فایل CSS خود کپی کنید (مسیر url() را با مسیر واقعی فایل‌ها تنظیم کنید)، سپس با font-family: 'RadikalWP-fraunces'; فونت را اعمال کنید. در فایل ZIP دانلودی، فایل آماده font-face.css و راهنمای فارسی هم وجود دارد.

فایل‌های فونت

fraunces-100.ttf
وزن ۱۰۰ — باریک ۶۱ KB
fraunces-100.woff
وزن ۱۰۰ — باریک ۳۲ KB
fraunces-100.woff2
وزن ۱۰۰ — باریک ۲۵ KB
fraunces-200.ttf
وزن ۲۰۰ — بسیار سبک ۶۱ KB
fraunces-200.woff
وزن ۲۰۰ — بسیار سبک ۳۳ KB
fraunces-200.woff2
وزن ۲۰۰ — بسیار سبک ۲۶ KB
fraunces-300.ttf
وزن ۳۰۰ — سبک ۶۱ KB
fraunces-300.woff
وزن ۳۰۰ — سبک ۳۴ KB
fraunces-300.woff2
وزن ۳۰۰ — سبک ۲۷ KB
fraunces-400.ttf
وزن ۴۰۰ — معمولی ۶۱ KB
fraunces-400.woff
وزن ۴۰۰ — معمولی ۳۴ KB
fraunces-400.woff2
وزن ۴۰۰ — معمولی ۲۷ KB
fraunces-500.ttf
وزن ۵۰۰ — متوسط ۶۱ KB
fraunces-500.woff
وزن ۵۰۰ — متوسط ۳۴ KB
fraunces-500.woff2
وزن ۵۰۰ — متوسط ۲۷ KB
fraunces-600.ttf
وزن ۶۰۰ — نیمه‌بولد ۶۱ KB
fraunces-600.woff
وزن ۶۰۰ — نیمه‌بولد ۳۴ KB
fraunces-600.woff2
وزن ۶۰۰ — نیمه‌بولد ۲۷ KB
fraunces-700.ttf
وزن ۷۰۰ — بولد ۶۱ KB
fraunces-700.woff
وزن ۷۰۰ — بولد ۳۵ KB
fraunces-700.woff2
وزن ۷۰۰ — بولد ۲۸ KB
fraunces-800.ttf
وزن ۸۰۰ — بسیار بولد ۶۱ KB
fraunces-800.woff
وزن ۸۰۰ — بسیار بولد ۳۴ KB
fraunces-800.woff2
وزن ۸۰۰ — بسیار بولد ۲۷ KB
fraunces-900.ttf
وزن ۹۰۰ — سیاه ۶۱ KB
fraunces-900.woff
وزن ۹۰۰ — سیاه ۳۴ KB
fraunces-900.woff2
وزن ۹۰۰ — سیاه ۲۷ KB