font-src
font-src
font-src
The font-src directive specifies the sources from which fonts can be loaded.
Recommended Values
'self'
Allows resources from the same origin
Allows resources from the same origin
https://subdomain.domain.com
Allows resources from a specific external site
Allows resources from a specific external site
Explore detailed value definitions
Tips & Tricks
If font-src is not defined, the default-src directive will be used.
Examples
Allows resources from the same origin and a specific external site
Content-Security-Policy: font-src 'self' https://fonts.gstatic.com;
Allowed
<!-- allowed by 'self' --> @font-face { font-family: 'MyFont'; src: url('/fonts/font.ttf'); } <!-- allowed by https://fonts.gstatic.com --> @font-face { font-family: 'ExternalFont'; src: url('https://fonts.gstatic.com/fonts/font.ttf'); }
Blocked
<!-- blocked as the domain is not authorized --> @font-face { font-family: 'MaliciousFont'; src: url('https://malicious.file.com/font.ttf'); }
Frequently Asked Questions
What is font-src and how does it work?
The font-src directive controls which sources can be used to load web fonts on a page. It helps prevent unauthorized font resources from being loaded, which could potentially be used for fingerprinting or to deliver malicious content.
Default Behavior
If font-src is not specified, the browser will fall back to default-src for a font loading policies.
What are common values for font-src?
Common values include 'self' for loading fonts from your own domain, specific URLs for trusted font providers like Google Fonts (fonts.gstatic.com), and data: for base64 encoded fonts. However, using data: can be risky as it allows any base64 encoded font content.
Security Note
Always specify trusted font sources explicitly rather than using broad wildcards (*) to maintain security.
Need to monitor CSP violations and maintain it easily?
Set up a reporting endpoint to monitor Content Security Policy violations in real-time to build and maintain your CSP easily.
Set up your endpoint now