Fonts

Adobe Fonts is one of those integrations that looks trivial until your CSP starts blocking it in production. You add the embed code, ship a strict policy, and suddenly your typography falls back to system fonts. Or worse, you loosen style-src too much just to get it working and quietly undo a big chunk of your CSP hardening. I’ve had to clean this up more than once. The good news: Adobe Fonts usually needs only a small set of allowances. The bad news: a lot of examples online are either too broad or copy-pasted from unrelated setups. ...

Boxicons looks simple from the frontend side: drop in a stylesheet, use a class like bx bx-home, and move on. Then CSP shows up and your icons quietly disappear. I’ve seen this happen a lot because Boxicons sits in an awkward spot for CSP. It’s “just icons,” but depending on how you load it, you may need to allow a stylesheet, font files, maybe images, and sometimes a CDN you forgot you were using. If your policy is tight — which it should be — Boxicons is exactly the kind of third-party asset that gets blocked first. ...

Remix Icon is easy to drop into a project, which is exactly why people ship it with a sloppy CSP. I’ve seen this a lot: someone adds the Remix Icon CDN snippet, the icons don’t render, they get a wall of CSP errors, and the “fix” becomes style-src 'unsafe-inline' plus a couple of random hostnames copied from the console. That works, but it’s the kind of fix that quietly makes the policy worse every time the app changes. ...

The hardest part of implementing CSP isn’t understanding the directives — it’s figuring out which domains to whitelist for every third-party service your site uses. Each one needs specific domains in specific directives, and the documentation is scattered across different sites. I’ve spent way too much time hunting down the exact domains for various services. Here’s everything in one place. These are tested, copy-paste ready, and include the domains most people miss. ...