Quick Start Guide for Creating Your Web Fonts Project
Search & Browse thousands of Fonts.com Web Fonts to find those perfect for your project.
Simply provide the URLs of the domains you want your fonts served to; it's that easy.
Use our flexible options for adding and editing CSS Selectors for your chosen fonts.
You're now ready to publish! Select a preferred publishing method, and set your project live.
Select & Add Fonts
A. Search for Fonts
Use the search bar present throughout Fonts.com to search for fonts by name, designer, or source foundry. You can also search for fonts by keyword or theme.
B. Browse Fonts
In the Browse Fonts section of Fonts.com you can additionally search for newly released, featured, and best selling fonts. You can also choose to search by typeface classification.
C. Add Fonts to Your Project
Including fonts in your project is easy – you can add the fonts you want through any search results page, font family page, or individual product page.
Simply provide the URLs of the domains you would like your fonts served to; it's that easy. An asterisk followed by a period (*.) can be used as a wildcard to add multiple subdomains to your Web fonts project.
For instance, listing "*.example.com" as your domain would allow you to use the Fonts.com Web Fonts service on subdomains such as first.example.com, second.example.com as well as third.example.com.
Add CSS Selectors
A. Add CSS Selectors
First, identify your website's CSS selectors, and add them each by name in the Selectors panel. This will allow the styled elements of your website to be assigned specific Web fonts.
Selectors are found in your site's CSS. Some of the more popular CSS selectors to look for are: h1, h2, div, body, bodycopy, header and footer. If you prefer to specify your fonts directly within your own CSS, you can do that as well, simply skip ahead to Publish Options.
B. Assign Fonts
Once you have added your site's CSS selectors, you can then proceed to assign fonts. Simply click the drop down menu under each selector and choose from the list of fonts you selected earlier. You will then see a preview of how your text for each selector will look.
C. CSS Sucker
Not sure which selectors your website employs? You can also use our CSS Sucker tool to extract a list of CSS selectors that are used on your website.
Available through annual or 3 year Standard plans, as well as all Professional plans, those that prefer to deploy Web fonts from their own environment can turn to our self-hosting option. Here you can download your self-hosting kit containing your fonts in the Web font formats needed to support all major browsers. Also included is an HTML demo page with setup instructions for adding the CSS syntax to your code, as well as a preview of your Web fonts in use.