Want to keep your site hosted on Netlify but show it off under your own branded domain? That’s exactly what connecting Cloudflare to Netlify lets you do.
Getting there means adding your custom domain, setting up the right Cloudflare DNS records, picking sensible proxy settings, and confirming SSL actually works. Most people run into trouble at the same spot: mixing up an apex domain with a subdomain and changing records without fully understanding what each one does.
This guide walks through connecting Cloudflare to Netlify step by step, plus how to fix the DNS, SSL, and connectivity issues that tend to pop up along the way.
How Does Cloudflare Work With Netlify?
Cloudflare and Netlify handle two very different jobs here.
Cloudflare takes care of your domain’s DNS configuration and can layer on extra network services. Netlify, meanwhile, hosts your website and actually serves it once someone requests it.
So when a visitor types your domain into their browser, DNS is what figures out where that domain should point. From there, the visitor lands on your Netlify-hosted site through the domain you’ve configured.
Cloudflare’s reach here is worth noting , it’s currently the DNS provider behind roughly 17.7% of all websites, according to W3Techs’ tracking of DNS server providers (w3techs.com). That’s part of why this particular combination , Cloudflare for DNS, Netlify for hosting , is such a common setup.
Step 1: Add Your Custom Domain to Netlify
Start in your Netlify dashboard.
Head to your site, open Domain management, and select Add a domain. Choose the option for a domain you already own, then type it in:
example.com
Netlify will verify it and hand you DNS configuration instructions tailored to your setup. Don’t just grab generic DNS records from some random tutorial online , the values Netlify gives you are specific to your domain and account, so use those.
Step 2: Open Your Cloudflare DNS Settings
Once your domain’s added to Netlify, switch over to Cloudflare.
Select the site tied to your domain, then go to:
DNS → Records
This is where all your domain’s DNS records live. You might already see a few in there for email, verification services, or other tools you use.
Step 3: Configure the CNAME Record for www
The www version of your domain , www.example.com , is technically a subdomain, and subdomains work well with CNAME records.
Go ahead and create one like this:
| Setting | Value |
|---|---|
| Type | CNAME |
| Name | www |
| Target | your-site.netlify.app |
| TTL | Auto |
Swap in your actual Netlify site address for the target.
What Is a CNAME Record?
Think of a CNAME record as an alias , it points one hostname toward another.
So in this case, www.example.com is configured to point at your-site.netlify.app.
It tells DNS: whenever someone requests the www version of your domain, route them through that Netlify hostname.
This is why CNAME records are the go-to choice for subdomains , they point to another hostname rather than a raw IP address.
Step 4: Configure the Apex Domain
Your apex domain is the root version, no www attached , just example.com. That’s different from www.example.com, which is a subdomain.
Why does this distinction matter so much? Because traditional DNS doesn’t let you use an ordinary CNAME record at the apex the same way you can on a subdomain.
For Netlify’s standard network, there are two documented paths:
If your DNS provider supports ALIAS, ANAME, or CNAME flattening, you can point your apex at apex-loadbalancer.netlify.com. If it doesn’t, Netlify’s fallback is an A record pointing to 75.2.60.5.
That said, always check the DNS instructions inside your own Netlify dashboard first , the exact values can shift depending on your specific setup.
Step 5: Decide Whether Cloudflare Proxy Should Be Enabled
Every Cloudflare DNS record can sit in one of two proxy states: orange cloud (proxy enabled) or gray cloud (DNS-only).
When you’re first connecting a new custom domain to Netlify, DNS-only tends to make troubleshooting a lot simpler , especially while Netlify is trying to validate your DNS and issue its SSL certificate.
If SSL provisioning stalls or fails while proxying is turned on, try flipping the relevant record to DNS-only temporarily. That alone often isolates the problem. Once your domain and certificate are confirmed working, you can revisit your proxy settings based on what you actually need.
Step 6: Configure SSL/TLS Correctly
SSL/TLS is what encrypts the connection between your visitors and your site. Once you add a custom domain to Netlify, it can automatically provision a certificate through Let’s Encrypt , and renew it automatically from then on.
Let’s Encrypt has become the backbone of encrypted web traffic more broadly: it now issues well over half of all SSL/TLS certificates on the internet, and has handed out more than a billion certificates since it launched, according to its own usage statistics tracked since 2016 (letsencrypt.org/stats). That scale is a big part of why free, automated HTTPS has become the default rather than the exception for sites like yours.
Cloudflare SSL/TLS vs Netlify SSL
These two systems work together, but they’re not doing the same job, and it’s easy to blur the line.
Netlify handles HTTPS for the content it hosts. Cloudflare handles SSL between your visitors and Cloudflare’s edge, but only when its proxy is active. And the connection between Cloudflare and Netlify itself also needs to be configured properly.
Mismatched SSL modes or conflicting certificate expectations between the two can cause connection errors that are frustrating to trace back. For a straightforward setup, confirm that Netlify’s certificate has actually been issued before you start tweaking Cloudflare’s more advanced SSL settings.
Step 7: Set Your Primary Domain in Netlify
With your DNS records in place, head back to Netlify and open:
Domain management → Production domains
Your custom domain should show up there, and Netlify will often associate both the apex and www versions automatically.
Step 8: Wait for DNS Propagation
DNS changes don’t show up everywhere instantly. Your DNS provider, various recursive resolvers, and even your own local network can hang onto cached versions of old records for a while , that lag is what people mean by DNS propagation.
Netlify’s own guidance notes that propagation can take a few hours, and in some cases up to 24–48 hours before it’s fully settled everywhere. You usually won’t need to wait that long, though , you can check progress using DNS lookup tools from different locations.
How to Check DNS Propagation
dig is the simplest way to check this yourself:
dig example.com
And separately for the www version:
dig www.example.com
Look for the A or CNAME response you’re expecting. If one location shows your new record while another still shows the old value, that’s just propagation or caching still catching up , give it a bit more time.
What If Your Domain Still Shows the Netlify URL?
Still seeing the .netlify.app address instead of your custom domain? Start by checking that the domain was added to the right Netlify project, and that it’s actually verified.
From there, go back and double-check your Cloudflare DNS records. A surprisingly common mistake is pointing the CNAME at the wrong Netlify project , make sure the target matches the exact hostname tied to your site.
Common Cloudflare and Netlify DNS Mistakes
Using the Wrong CNAME Target
Your CNAME needs to point to your actual Netlify site hostname , not some generic Netlify domain that doesn’t correspond to your project.
Adding https:// to a DNS Record
DNS records don’t need a protocol prefix. Use your-site.netlify.app, not https://your-site.netlify.app.
Creating Conflicting DNS Records
Multiple records pointing at the same hostname can create unpredictable results. Before you dig deeper into any weird behavior, check for conflicting A, AAAA, and CNAME entries first.
Forgetting the Apex Domain
Getting www.example.com right doesn’t mean your root domain is configured correctly too , always check both versions separately.
Changing Nameservers Unnecessarily
Netlify hosting your site doesn’t obligate you to move DNS management over to Netlify. Cloudflare can absolutely stay your external DNS provider , or you can switch to Netlify DNS if that fits your workflow better. It’s your call either way.
Cloudflare Nameservers vs Netlify Nameservers
Nameservers determine who’s actually in charge of your domain’s DNS zone.
If your domain currently uses Cloudflare’s nameservers, that’s where your records live and get managed. Switch to Netlify DNS, and that management shifts over entirely.
One rule worth repeating: don’t try to run both providers as authoritative DNS managers for the same domain at once , that’s a recipe for conflicting records. If Cloudflare is your provider of choice, keep its nameservers active and configure the required Netlify records there.
Should You Use Cloudflare DNS or Netlify DNS?
There’s no rule that says you have to move your domain over to Netlify DNS.
Sticking with Cloudflare as your external DNS provider means you keep managing your existing records in one place , which is especially convenient if Cloudflare already handles your email, verification, or security records. Given how widely used Cloudflare already is across the web, this is a familiar setup for a lot of teams.
Netlify DNS, on the other hand, offers tighter integration with Netlify’s own features and can simplify domain management if you’re all-in on the platform.
How to Fix Cloudflare Error 521 With Netlify
Error 521 means Cloudflare tried to connect to your origin server and couldn’t. It usually shows up when the origin is refusing Cloudflare’s connections or is simply unavailable , but with a Netlify setup, there are a few extra DNS and SSL wrinkles to consider.
Start by confirming your domain actually resolves to the Netlify infrastructure you expect. Then check your Cloudflare proxy status , temporarily switching the relevant record to DNS-only can help you figure out whether proxying itself is part of the problem.
Also worth checking: your Netlify domain status and SSL certificate. If Netlify hasn’t successfully verified the domain yet, sort that out before touching anything else in Cloudflare.
What Causes Error 521?
A few usual suspects:
- The origin server is down or unreachable
- Cloudflare’s requests are being blocked somewhere
- DNS records are pointing to the wrong destination
- SSL/TLS settings on each side don’t match up
- The origin isn’t accepting the connection type Cloudflare expects
- Firewall rules are interfering with Cloudflare’s traffic
- A proxy configuration has created an unexpected connection path
For traditional hosting setups, firewall and origin-server checks matter a lot here. With Netlify, though, your first move should be confirming the domain is actually connected to the right Netlify project.
Cloudflare DNS Configuration Checklist
Before you call the setup done, run through this list:
- Domain added to Netlify
- Cloudflare set as the active DNS provider
- www CNAME pointing to your Netlify hostname
- Apex domain configured the way Netlify recommends
- No conflicting DNS records left over
- Primary domain set correctly in Netlify
- DNS-only mode tested if proxying caused issues
- SSL successfully provisioned by Netlify
- Both HTTP and HTTPS working
- Preferred domain redirecting properly
- DNS records resolving consistently
Running through this checklist catches most of the common custom-domain headaches before they become real problems.
When Should You Use Netlify DNS Instead?
Netlify DNS makes sense if you want DNS management tightly woven into your Netlify projects , think advanced subdomain automation, deploy-specific subdomains, and certificate management handled end-to-end in one place.
That said, an external provider like Cloudflare often makes more sense for organizations that already manage a lot of DNS records there. In the end, it comes down to matching your DNS setup to your broader hosting, security, email, and infrastructure needs.
How Tambena Consulting Can Help With Netlify and Cloudflare Setup
Domain configuration looks simple right up until DNS, hosting, SSL, and deployment start interacting in ways you didn’t expect.
Tambena Consulting works with businesses on exactly this kind of infrastructure , web development, DevOps, cloud technologies, database services, and ongoing product support. Rather than treating DNS as an isolated task, the team looks at it as part of your broader web platform and technical setup.
If you need help connecting domains, deploying applications, or managing your technical infrastructure more broadly, Tambena Consulting is worth reaching out to for project support.
Final Thoughts
At its core, connecting a Cloudflare domain to Netlify comes down to getting your DNS configuration right , and understanding the difference between your apex domain and subdomains like www. is the piece that trips up the most people.
Set up your custom domain in Netlify first, add the required Cloudflare DNS records, then give propagation some time and let Netlify provision its SSL certificate. If something’s not working, work through DNS records, proxy status, SSL settings, and Netlify’s domain status one at a time rather than changing everything at once.
Take it step by step, and Cloudflare-to-Netlify setups are a lot easier to get right , and to troubleshoot later, than they first appear.
