Canvas fingerprinting is a browser tracking technique that draws an invisible image using the HTML5 Canvas API and reads the resulting pixel data to create a unique identifier for your device — no cookies, no storage, nothing to delete. You can test whether your browser exposes a canvas fingerprint right now on whatsmy.fyi.
TL;DR
Canvas fingerprinting is a tracking method that tells your browser to draw a hidden image and then reads the pixel data to identify your device. It works because your GPU, operating system, and font renderer each introduce tiny, consistent differences in how that image is drawn — invisible to the human eye, but unique to your hardware and software combination.
What Is Canvas Fingerprinting?
Canvas fingerprinting exploits the HTML5 Canvas API, a feature designed to let browsers draw graphics directly in the browser window. Every modern browser supports it — which means the tracking surface is nearly universal. When a fingerprinting script runs, it creates an off-screen canvas element that is completely invisible to you, draws text and shapes onto it, then calls canvas.toDataURL() to read back the pixel data as a Base64 string. That string is then hashed into a compact, stable fingerprint.
What makes canvas fingerprinting powerful is that the pixel output is not perfectly consistent across devices. The same drawing commands produce subtly different results depending on your GPU manufacturer, graphics driver version, operating system, installed fonts, and anti-aliasing settings. Two machines that look identical on paper — same OS, same browser version — may still produce a different canvas hash because their GPU drivers differ. The Electronic Frontier Foundation's Cover Your Tracks tool consistently ranks canvas output among the highest-entropy signals in the browser fingerprinting toolkit.
Canvas fingerprinting is one component of the broader family of browser fingerprinting techniques. Unlike cookies, it requires no storage on your device and is completely unaffected by clearing your browsing history, enabling private mode, or switching networks.
How Does Canvas Fingerprinting Work?
The process happens in four steps, each taking only milliseconds and entirely invisible to the user.
Step 1 — Drawing the Canvas
A JavaScript snippet creates an off-screen canvas element and draws a combination of text, shapes, and gradients using specific fonts, colors, and blend modes. The complexity of the drawing matters: simple geometric shapes produce less variation; font-heavy text with shadows and gradients produces more.
Step 2 — GPU and OS Rendering
The browser passes the drawing instructions to the operating system's graphics stack. On Windows, ClearType handles sub-pixel font rendering. On macOS, Core Text applies its own hinting algorithm. On Linux, FreeType renders differently again. Your GPU handles anti-aliasing and color interpolation. Each layer introduces consistent but device-specific variation at the pixel level.
Step 3 — Pixel Extraction
The script calls canvas.toDataURL() to read the completed image as a Base64-encoded PNG. This string encodes every pixel value — including the sub-pixel variations introduced during rendering. Alternatively, scripts may use canvas.getImageData() to access the raw pixel buffer directly.
Step 4 — Hashing
The Base64 string or raw pixel buffer is hashed — commonly using MurmurHash or MD5 — to produce a compact, stable fingerprint value. This hash is transmitted to the tracking server and stored as a device identifier.
// Minimal canvas fingerprinting example
function getCanvasFingerprint() {
const canvas = document.createElement('canvas');
canvas.width = 280;
canvas.height = 60;
const ctx = canvas.getContext('2d');
// Background — color blending varies by GPU
ctx.fillStyle = 'rgb(255, 102, 0)';
ctx.fillRect(10, 10, 100, 30);
// Text — font rendering varies by OS (ClearType / Core Text / FreeType)
ctx.fillStyle = '#069';
ctx.font = '18px Arial';
ctx.fillText('Canvas fingerprint', 2, 45);
// Shadow — shadow rendering varies by graphics driver
ctx.shadowColor = 'rgba(0, 0, 0, 0.5)';
ctx.shadowBlur = 6;
ctx.shadowOffsetX = 2;
ctx.shadowOffsetY = 3;
// Returns a Base64 string that differs subtly across devices
// even with identical browser and OS versions
return canvas.toDataURL();
}How Unique Is a Canvas Fingerprint?
Canvas fingerprinting contributes significant entropy to the overall browser fingerprint. Research findings vary by dataset and methodology, but the direction is consistent: canvas output is a high-signal identifier, particularly when combined with other browser attributes.
| Finding | Value | Source |
|---|---|---|
| Canvas entropy in isolation | 8–10 bits | EFF Cover Your Tracks |
| Browsers uniquely identifiable via canvas alone | 83.6% | BrowserLeaks |
| Share of top 20,000 websites using canvas fingerprinting | 12.7% | ACM Internet Measurement Conference, 2025 |
| Real-world overall uniqueness (8 million fingerprints) | 33.6% | Academic field study, 2018 |
| Canvas uniqueness on mobile devices | 62% | ACM Internet Measurement Conference, 2025 |
The gap between laboratory results (80–90% uniqueness) and real-world data (33.6%) exists because many popular configurations produce identical canvas output. All MacBook Pros running the same macOS and Safari version, for example, share a canvas hash. Uniqueness is highest on devices with unusual GPU and driver combinations. Mobile devices score higher because hardware fragmentation is greater.
Who Uses Canvas Fingerprinting in the Real World?
Advertising Networks
Ad-tech companies use canvas fingerprinting to track users across websites for behavioural targeting and frequency capping. It became especially valuable as third-party cookies were deprecated across major browsers — canvas fingerprinting fills the same identification role without requiring any cookies or user consent in most current implementations.
Fraud Detection Platforms
Security companies such as Fingerprint (formerly FingerprintJS) and Castle.io use canvas fingerprinting to detect account takeovers, credential stuffing, and bot activity. If a device's canvas fingerprint does not match the one on record for an account, it triggers a risk signal for review. This use case typically qualifies under GDPR's legitimate interest basis without requiring explicit consent.
Paywall and Metered Access Enforcement
News publishers and subscription services use canvas fingerprinting to enforce article limits on users who clear cookies to reset their metered access counter. Because the fingerprint is derived from hardware rather than stored data, it persists through cookie deletion and private browsing.
Is Canvas Fingerprinting Legal?
Under the GDPR in Europe, canvas fingerprinting constitutes processing of personal data when the resulting hash can reasonably be linked to an individual. The French data protection authority (CNIL) has explicitly named browser fingerprinting as requiring informed consent unless a narrow legitimate interest exemption applies. Under the US CCPA and CPRA, fingerprinting data is treated as personal information subject to opt-out rights, and multiple class-action lawsuits have been filed against ad-tech companies using fingerprinting without disclosure.
The W3C Fingerprinting Guidance acknowledges canvas as a "high-fidelity fingerprinting vector" and advises web specification authors to consider fingerprinting risk when designing new browser APIs. Enforcement across jurisdictions remains inconsistent.
How to Protect Yourself from Canvas Fingerprinting
Complete prevention is difficult — effective defences involve trade-offs in web compatibility. These options are ranked from strongest to most practical for daily use:
- Tor Browser (strongest protection): Tor normalises canvas output so that every Tor user returns an identical canvas hash, making individual identification impossible. The trade-off is slower browsing due to the Tor network.
- Brave Browser (recommended for daily use): Brave uses a technique called Farbling — it injects a small, randomised, per-session noise value into canvas pixel output. Your fingerprint changes each session and per site, making cross-site tracking unreliable while remaining visually indistinguishable to you.
- Firefox with
privacy.resistFingerprinting: Setting this flag totrueinabout:configmakes Firefox return uniform canvas output similar to Tor Browser. It is disabled by default; some sites that rely on canvas-based graphics may behave unexpectedly. - CanvasBlocker extension (Firefox and Chrome): This extension intercepts
canvas.toDataURL()andgetImageData()calls and either blocks them entirely or returns randomised data. Useful for users who need fingerprint protection without switching browsers. - Avoid rare fonts and unusual GPU drivers: Keeping drivers updated and using standard hardware reduces the uniqueness of your canvas output. Rare driver versions produce more distinctive rendering artefacts.
- Use a VPN — but understand its limits: A VPN masks your IP address but has no effect on canvas output. It removes one layer of tracking but does not address fingerprinting. Check whether your VPN is working on whatsmy.fyi.
Frequently Asked Questions
Does canvas fingerprinting work in incognito or private mode?
Yes. Private browsing mode prevents your browser from saving history, cookies, and form data to disk — but it does not change your GPU, graphics driver, or OS font renderer. Your canvas fingerprint is identical in incognito mode and in a normal window. Only browsers with active fingerprint randomisation, such as Brave or Tor Browser, behave differently.
Can a VPN prevent canvas fingerprinting?
No. A VPN changes your visible IP address and routes traffic through an encrypted tunnel, but it does not touch the browser's rendering stack. Canvas fingerprinting reads GPU and OS-level rendering data, which is entirely unaffected by which server your traffic passes through. To protect against canvas fingerprinting, use Brave Browser, Firefox with privacy.resistFingerprinting, or Tor Browser.
Is canvas fingerprinting the same as cookie tracking?
No. Cookie tracking stores an identifier file on your device, which you can view, delete, or block. Canvas fingerprinting stores nothing — it reconstructs an identifier from the hardware and software characteristics of your device on every visit. Clearing cookies, deleting local storage, or blocking third-party cookies has no effect on canvas fingerprinting.
Does disabling JavaScript stop canvas fingerprinting?
Yes — canvas fingerprinting requires JavaScript to run. If you disable JavaScript entirely, the fingerprinting script cannot execute. However, disabling JavaScript breaks most modern websites. A more practical approach is using Brave's Farbling or the CanvasBlocker extension, which intercept canvas API calls specifically without disabling general JavaScript functionality.
How is canvas fingerprinting different from WebGL fingerprinting?
Both exploit the browser's graphics rendering pipeline, but they target different APIs. Canvas fingerprinting uses the 2D Canvas API and is sensitive to font rendering and sub-pixel text differences. WebGL fingerprinting uses the 3D graphics API and directly exposes your GPU vendor name, GPU model, and driver version. They are often deployed together because they capture complementary dimensions of device uniqueness. See the WebGL fingerprinting guide for more detail.
Is canvas fingerprinting accurate enough to replace cookies entirely?
On its own, canvas fingerprinting is insufficient — real-world uniqueness across large datasets is around 33.6%. But when combined with WebGL renderer data, audio fingerprinting, screen dimensions, timezone, and hardware concurrency, the combined fingerprint approaches cookie-level accuracy. Commercial fingerprinting platforms typically layer 30 or more signals together, with canvas as one of the highest-contributing individual components.
What is the difference between a canvas fingerprint and a canvas pixel hash?
A canvas fingerprint is the overall device identifier derived from the canvas rendering process. A canvas pixel hash is a specific implementation where the raw pixel buffer from canvas.getImageData() is hashed directly, rather than using the Base64 string from toDataURL(). Both methods extract the same underlying rendering variation; the pixel hash approach is faster and produces a more compact value. See the WebGL pixel hash guide for a related deep-dive.
Related Articles
- What Is Browser Fingerprinting? How Sites Track You Without Cookies — the complete guide to all fingerprinting signals combined
- What Is WebGL Fingerprinting? How Your GPU Identifies Your Browser — how the 3D graphics API exposes your GPU vendor and driver version
- What Is Audio Fingerprinting? How AudioContext Tracks Your Browser — how your device's audio stack produces a unique identifier
- What Is Font Fingerprinting? How Installed Fonts Track You Online — how your installed fonts contribute to your browser fingerprint
