How to Identify a Font on a Website

01 / Verify selectable text

Find the rendered font in Chrome

For ordinary text on a live website, your browser can often show the actual font used to draw it. This is more direct evidence than asking an image matcher to recognise the shapes.

1. Open the website in desktop Chrome and let it finish loading.
2. Right-click the specific heading or paragraph and choose Inspect. Select the element that contains the text, not an unrelated surrounding container.
3. In the Elements panel, open Computed. Search for font-family to see the declared family or list of fallback families.
4. Scroll to Rendered Fonts at the bottom of Computed to see the fonts used for that selected text. More than one font can appear when characters come from different fonts.
5. Also note font-weight, font-style and font-size if you are trying to reproduce the appearance.

Chrome’s Inspect mode documentation explains selecting text elements and viewing their font properties.

How to find a website font without installing an extension

For selectable text, use the browser’s built-in inspection tools. In desktop Chrome, right-click the text, choose Inspect, then open Computed → Rendered Fonts. You do not need to install an extension to use this method.

Choose the method by what you have in front of you:

• A live heading or paragraph: inspect that exact text. This can reveal the font actually rendered, rather than a visually similar family.
• A logo, banner or screenshot: use a cropped image. There is no font-family information to read from the lettering inside a bitmap.
• Only a public page address: use the URL font finder for visual candidates, then verify selectable text in your browser.

Do not assume that a website uses one font everywhere. Check its heading, body copy and buttons separately if you are documenting a design.

How to read font-family, weight and rendered-font results

Imagine a heading declares font-family: "Example Sans", Arial, sans-serif and font-weight: 700. This is an illustrative example, not a measurement from a particular website.

The declaration means the browser should try Example Sans first, then Arial, then its generic sans-serif fallback. It does not prove that Example Sans loaded. If Rendered Fonts lists Arial for the selected heading, record Arial as the rendered font on that device at that moment.

Record the family together with the weight and style. A regular and a bold face can look different even when they belong to the same family. A variable font may also use width or optical-size settings; those settings help explain why the same font name does not always produce the same appearance.

Why is Rendered Fonts empty?

Check that you selected an element containing visible text, not an image or an empty wrapper. If the text is inside a nested element, select that element and check again. For text drawn into an image or canvas, switch to visual comparison instead of expecting a CSS declaration to identify the letters.

Can I find a website font on my phone?

If you only have a phone available, capture the text in a screenshot, crop to a single readable line and use the image guide. Treat the result as a candidate, not the name of the loaded web font. For a direct rendered-font check, use desktop browser inspection when available.

02 / Get visual candidates

Identify website fonts from a URL

If you want a visual shortlist without opening developer tools, you can use GetMyFont’s URL input.

1. Open GetMyFont and choose From URL.
2. Paste the public page address and select Identify fonts.
3. GetMyFont captures a screenshot of the page and analyses the visible typography.
4. Compare the likely matches with the site’s text and verify them with the browser method above when possible.

This is screenshot-based matching, not a CSS-font audit. It does not guarantee the exact family loaded by the website. Pages that need a login or block screenshot capture may not produce a usable result; do not paste private or signed access links.

If the capture fails or misses the text you want, take a screenshot yourself, crop to one readable line, and use the image-identification method.

Why the font name or appearance may differ

The web font did not load

A browser may use a fallback while a font loads, or if the download fails. Wait for loading to finish, then check Rendered Fonts again. Your screenshot and your browser may have captured different loading states.

The heading is actually an image

A logo or banner can contain text drawn into an image. Inspecting its container will not reveal a font for the letters inside it. Use a cropped image sample and treat the matches as candidates.

Different letters use different fonts

A fallback may supply symbols or characters absent from the preferred family. Inspect the particular text you care about; do not assume one heading represents the entire site.

The family is right, but the style looks wrong

Check weight, italic style, size and letter spacing. Variable fonts can also have adjustable axes that change their appearance within the same family.

Check the licence before reusing a website font

A font displayed on another website is not automatically free to download, copy or embed. Find the family through its official foundry or distributor and check the licence for your intended desktop, website or app use.

Google Fonts provides open-source fonts with licence conditions. Adobe Fonts has its own terms for web projects. The name of a font or an alternative suggestion does not replace those terms.

If you cannot confirm the exact family, use a clearly identified alternative and verify its licence rather than presenting an uncertain visual match as a fact.

Keep investigating