# Genişlik eksenli değişken fontlar

> Ağırlığın yanı sıra harf genişliğinin de ayarlanabildiği değişken aileler: yazıyı sığdırmak için hafif daraltmadan, dardan genişe tam bir aralığa kadar.

Değişken font, bir tasarımı sabit stiller kümesi yerine bir aralık olarak saklar. Çoğu değişken aile bir ağırlık ekseni sunar; daha az sayıda aile, wdth etiketiyle kayıtlı bir genişlik ekseni ekler. Bu eksen harfleri yüksekliklerini ve karakterlerini koruyarak daha dar ya da daha geniş yapar. Değerleri normal genişliğin yüzdesidir: 75 dar bir kesim, 100 normal, 125 geniş bir kesimdir.

Genişlik, yerleşim işlerinde çoğu zaman iki eksenden daha pratik olanıdır. Bir başlığı sütununa tam oturtmanıza, bir gezinme etiketini küçük ekranda sıkıştırıp büyük ekranda gevşetmenize ya da bir tabloyu yalnızca sütunları yer bulamadığında daha dar bir ayara geçirmenize izin verir. CSS'te özellik font-stretch, daha ince denetim için font-variation-settings'tir ve kesme noktalarında değişebilir ya da canlandırılabilir.

Seçmeden önce aralıkları karşılaştırın. Buradaki birkaç aile yalnızca daralır, 100'den 75 civarına; bu yazıyı sığdırmak için yeterlidir. İkisi yalnızca genişler; diğerleri normal genişliğin yarısından ikiye katına gider ve fiilen tek ailede birkaç yazı tipidir. Aşağıdaki notlar her aralığı kayıtlı olduğu gibi belirtir. İyi çizilmiş bir genişlik ekseni, metni yapay biçimde ezmekten farklı olarak harf biçimlerini kendisi ayarlar.

How these were chosen: Ağırlığa ek olarak kayıtlarında genişlik (wdth) ekseni listelenen değişken aileler; eksen aralıkları kayıtlardan alıntılanmıştır.

## Fonts (17)

- [Roboto](https://trendhub.net/tr/fonts/roboto.markdown) (Sans Serif, 18 stil · değişken, OFL): 75'ten 100'e bir genişlik ekseni tasarımı dar bir kesime doğru daraltır; yanında 100'den 900'e ağırlık ve italikler.
- [Open Sans](https://trendhub.net/tr/fonts/open-sans.markdown) (Sans Serif, 12 stil · değişken, OFL): Genişlik, yazıyı sığdırmak için 100'den 75'e daralır; italikli altı ağırlıklı humanist bir sans'ta.
- [Archivo](https://trendhub.net/tr/fonts/archivo.markdown) (Sans Serif, 18 stil · değişken, OFL): 62'den 125'e genişlik, çok dardan geniş stile; yanında Thin'den Black'e ağırlık ve italikler.
- [Saira](https://trendhub.net/tr/fonts/saira.markdown) (Sans Serif, 18 stil · değişken, OFL): Kare hatlı bir sans'ta 50'den 125'e genişlik ve 100'den 900'e ağırlık, ayrıca italikler.
- [IBM Plex Sans](https://trendhub.net/tr/fonts/ibm-plex-sans.markdown) (Sans Serif, 14 stil · değişken, OFL): Harfleri 75'e kadar daraltan bir genişlik ekseni; yedi ağırlık ve italikler.
- [Inconsolata](https://trendhub.net/tr/fonts/inconsolata.markdown) (Eş Aralıklı, 8 stil · değişken, OFL): Genişlik ekseni 50'den 200'e, yani normal genişliğin yarısından ikiye katına uzanan bir eş aralıklı font; yanında 200'den 900'e ağırlık.
- [Noto Serif](https://trendhub.net/tr/fonts/noto-serif.markdown) (Serif, 18 stil · değişken, OFL): Genişlik ekseni 100'den 62,5'e daralan bir metin serif'i; italikli dokuz ağırlık.
- [Merriweather](https://trendhub.net/tr/fonts/merriweather.markdown) (Serif, 14 stil · değişken, OFL): 87'den 112'ye mütevazı bir genişlik aralığına sahip metin serif'i; yanında ağırlık ve optik boyut eksenleri.
- [Asap](https://trendhub.net/tr/fonts/asap.markdown) (Sans Serif, 18 stil · değişken, OFL): 100'den 900'e ağırlık ve 75'ten 125'e genişlik, italikli.
- [Georama](https://trendhub.net/tr/fonts/georama.markdown) (Sans Serif, 18 stil · değişken, OFL): 62,5'tan 150'ye, dardan genişe bir genişlik ekseni ve italikli dokuz kalınlık.
- [Zalando Sans](https://trendhub.net/tr/fonts/zalando-sans.markdown) (Sans Serif, 16 stil · değişken, OFL): Sade bir grotesk'te 75'ten 125'e genişlik ve 200'den 900'e kalınlık, ayrıca italikler.
- [Science Gothic](https://trendhub.net/tr/fonts/science-gothic.markdown) (Sans Serif, 18 stil · değişken, OFL): Dört eksen: 100–900 kalınlık, 50–200 genişlik, eğim ve kontrast.
- [Advent Pro](https://trendhub.net/tr/fonts/advent-pro.markdown) (Sans Serif, 18 stil · değişken, OFL): Genişlik burada yalnızca 100'den 200'e genişler; yanında 100'den 900'e kalınlık.
- [Mozilla Headline](https://trendhub.net/tr/fonts/mozilla-headline.markdown) (Sans Serif, 6 stil · değişken, OFL): Bir başlık sans'ında 200'den 700'e kalınlık ve 75'ten 125'e genişlik.
- [Anek Latin](https://trendhub.net/tr/fonts/anek-latin.markdown) (Sans Serif, 8 stil · değişken, OFL): Thin'den ExtraBold'a sekiz dik kalınlıkta 75'ten 125'e genişlik.
- [Pliant](https://trendhub.net/tr/fonts/pliant.markdown) (Sans Serif, 18 stil · değişken, OFL): Genişlik yalnızca 100'den 125'e genişler; dokuz kalınlık, italikler, Kiril ve Yunanca.
- [Ubuntu Sans](https://trendhub.net/tr/fonts/ubuntu-sans.markdown) (Sans Serif, 16 stil · değişken, UFL): Menüler, düğmeler ve iletişim kutuları için yapılmış bir sans'ta 100'den 75'e daralan genişlik ekseni; sekiz kalınlık ve italikler.

## FAQs

### CSS'te font genişliğini nasıl ayarlarım?

Yüzdeyle font-stretch kullanın, örneğin font-stretch: 85%, ya da font-variation-settings: “wdth” 85. Değer fontun desteklediği aralıkta olmalıdır; dışındaki değerler en yakın uca çekilir.

### Genişlik ekseni, metni yatayda ölçeklemekle aynı şey mi?

Hayır. Ölçekleme çizgi kalınlığını ve eğrileri bozar. Genişlik ekseni her genişlik için çizilmiş biçimleri kullanır; böylece dikey ve yatay çizgiler orantılı kalır.

### Değişken fontlar tüm tarayıcılarda ve uygulamalarda çalışır mı?

Güncel tarayıcılar ve başlıca tasarım uygulamaları destekler. Eski yazılımlar yalnızca varsayılan stili gösterebilir; bunun önemli olduğu yerde yedek olarak statik dosyalar bulundurun.

### Bu değişken fontları ticari olarak kullanabilir miyim?

Evet. Biri dışında hepsi SIL Open Font License altındadır; bu lisans ticari kullanıma, gömmeye ve kendi sunucunuzda barındırmaya izin verir. Ubuntu Sans, ticari kullanıma yine izin veren Ubuntu Font License'ı kullanır. Her font sayfası lisansını belirtir.

## Related collections

- [Optik boyut eksenli değişken fontlar](https://trendhub.net/tr/fonts/for/variable-fonts-with-optical-size.markdown)
- [Alışılmadık eksenli değişken fontlar](https://trendhub.net/tr/fonts/for/variable-fonts-with-unusual-axes.markdown)
- [Tablolar ve sıkışık düzenler için dar sans serif fontlar](https://trendhub.net/tr/fonts/for/narrow-fonts-for-tight-layouts.markdown)
- [Başlıklar için dar fontlar](https://trendhub.net/tr/fonts/for/condensed-headline-fonts.markdown)
- [Başlıklar ve logolar için geniş fontlar](https://trendhub.net/tr/fonts/for/wide-and-extended-fonts.markdown)
- [Dokuz ağırlıklı ve italikli font aileleri](https://trendhub.net/tr/fonts/for/font-families-with-nine-weights.markdown)

---

Source: https://trendhub.net/tr/fonts/for/variable-fonts-with-a-width-axis (trendhub)
