Jak sprawdzić czcionkę na stronie w Chrome, Firefox lub Operze

Widzisz na stronie ciekawą czcionkę i chcesz sprawdzić, jaka jest jej nazwa? Można to zrobić za pomocą źródła strony lub specjalnego rozszerzenia do przeglądarki, które automatycznie rozpozna wskazany element i wyszuka nazwy czcionki.

Na stronach internetowych coraz częściej można znaleźć tekst napisany niestandardową czcionką, która na bieżąco jest pobierana np. za pomocą skryptu Google Fonts. Jeśli znaleźliśmy stronę z czcionką, która bardzo nam się podoba i również chcielibyśmy jej użyć, to możemy sprawdzić, jak się ona nazywa.

Sprawdzenie czcionki na stronie jest możliwe za pomocą źródła strony, a także za pomocą specjalnych wtyczek, które po zaznaczeniu tekstu automatycznie wyszukają odpowiedniego fragmentu w kodzie strony i wyświetlą nazwę czcionki. Dla początkującego użytkownika użycie wtyczki jest zdecydowanie łatwiejsze.

Sprawdź czcionkę na stronie za pomocą rozszerzenia Font Finder

Jednym z najprostszych sposobów jest użycie rozszerzenia Font Finder, które jest dostępne dla przeglądarek Chrome, Opera oraz Firefox. Można je pobrać z oficjalnego repozytorium Google bądź Mozilli, korzystając z linków poniżej:

Pobierz Font Finder dla Chrome

Pobierz Font Finder dla Opery

Pobierz Font Finder dla Firefox

Wejdź w powyższy link, zgodny z posiadaną przeglądarką, a następnie pobierz i zainstaluj rozszerzenie. Gdy masz już dodatek Font Finder zainstalowany w przeglądarce, to pora z niego skorzystać. Z pewnością po zainstalowaniu dodatku zauważysz, że tuż obok paska adresu pojawiła się ikona Font Finder – za jej pomocą możemy sprawdzić czcionkę na stronie. Zobaczmy, jak to zrobić.

Wejdź na stronę, na której znajduje się tekst napisany czcionką, która Ci się podoba. Będąc na tej stronie kliknij w przycisk rozszerzenia na pasku przeglądarki. Wejdziesz do trybu zaznaczania.

Najedź kursorem na nagłówek lub akapit, który jest napisany czcionką, którą chcesz sprawdzić, a następnie kliknij lewym przycisk myszy. Tekst zostanie zaznaczony i pojawi się nowe okienko, które automatycznie rozpoznaje i wyodrębnia kod CSS odpowiedzialny za styl wskazanego elementu (nagłówka lub akapitu).

Wśród kodu znajdziesz sekcję „Font” (czcionka) i wiersz o nazwie „Font being rendered” (czcionka użyta do renderowania tekstu). W tym miejscu wyświetla się nazwa wykorzystanej czcionki.

Z reguły nazwa jest uproszczona, ale po wpisaniu jej w Google powinniśmy trafić na stronę, na której można znaleźć lub zakupić (w zależności od licencji) wskazaną czcionkę.

Przykładowo, w naszym przypadku jest to czcionka opisana jako „familiarpro”. Jej pełna nazwa to „Familiar PRO”, więc po wpisaniu jej w wyszukiwarkę Google z pewnością trafimy w odpowiednie miejsce. W ten sposób możemy szybko i łatwo znaleźć krój każdej czcionki, która jest użyta do stylizacji faktycznego tekstu występującego na stronie.

Komentarze