Your logo, kept yours.
cloakmark turns a logo into a self-contained web component. There is no file to hotlink, no image to save or drag out, and every copy carries its owner's name.
See how it worksTry to take it.
The Altokoda logo below is drawn by cloakmark. Right-click it, drag it, or open your browser's developer tools and look for it.
Your attempts
- Right-clickNot tried yet
- Drag outNot tried yet
- Developer toolsNothing to save
In developer tools you will find a closed shadow root holding a canvas. There is no image element and no file.
On the web, a logo is just a file.
Every website hands its logo to every visitor. Taking it takes seconds.
- 01
Save Image As
One right-click saves the original file at full quality.
- 02
Drag and drop
Dragging the image out of the page copies it just as easily, even from developer tools.
- 03
Hotlinking
A public file address lets any other site show your logo, served from your own server.
- 04
Scraping
Crawlers collect logos in bulk by looking for image links and SVG markup.
How it works.
cloakmark runs once, when the website is built. What it produces is a small script and a single tag.
Prepare
SVG logos are cleaned and minified. WebP, PNG and JPEG are embedded untouched, with their exact size read from the file.
Watermark
The owner's name is drawn into the image itself, tiled across the logo's shape.
Scramble
The image is encoded and scrambled with a key that changes on every build, so it no longer reads as an image or as text.
Package
Everything becomes one self-contained script and a <secure-logo> tag. No libraries and no image files.
Render
In the browser, the logo is unscrambled in memory and painted onto a canvas inside a closed shadow root.
<secure-logo name="logo"></secure-logo>
<script src="/cloakmark/logo.js" defer></script>Two lines on the page. The logo name and the file are the only parts that change.
A mark of ownership in every copy.
Each logo carries its owner's name inside the image, at two strengths. cloakmark sets them, never the website.
On your site, hidden.
Visitors see the logo exactly as designed. The mark sits at a few percent opacity, invisible at normal viewing, and a contrast filter brings it out of a screenshot.
On any copy, plain to see.
A file pulled out of the page opens with the owner's name across the logo. Only cloakmark knows how to show the hidden version.
- The owner's name is set for each logo
- Its strength is fixed by cloakmark, so no website can turn it down
- It follows the logo's shape, so transparent areas stay clean
Locked to your domains.
A logo can be built to render only on the sites you name. Paste its script anywhere else and the logo stays blank.
- Exact hosts, or every subdomain with a wildcard such as *.example.com
- The domain list is mixed into the scramble, so editing it breaks the logo
- Development builds are kept separate, so a live logo never renders on someone's own machine
| Host | Result |
|---|---|
| example.com | Renders |
| www.example.com | Renders |
| shop.example.com | Renders |
| another-site.com | Stays blank |
| localhost | Stays blank |
Works with the logos and sites you already have.
Logo formats
- SVGStays sharp at any size and on any screen.
- WebPLossy, lossless, transparent.
- PNGIncluding transparency.
- JPEGCamera rotation is respected.
Websites
- Any HTML page
- WordPress
- Shopify
- Webflow
- Squarespace
- Wix
- React and Next.js
- Vue and Nuxt
- Angular
0
Dependencies
Nothing to install on the website. The script stands on its own.
No shift
Layout
Space is reserved at the logo's proportions before it draws.
Sharp
At any size
The canvas repaints at the screen's pixel density on resize and zoom.
Labelled
Accessible
Screen readers announce the logo as an image, with its name.
What it stops, and what it does not.
cloakmark is a strong deterrent, not encryption. A browser needs the logo to show it, so a determined developer can still rebuild it. What they end up with still carries the owner's name.
It stops
- Right-click saving and dragging, including from developer tools
- Hotlinking and scraping by file address
- Crawlers looking for SVG markup or image links
- Reuse on other websites, with a domain lock
- A clean copy: every extracted file shows the watermark
It does not stop
- Screenshots, although they carry the hidden mark
- A developer stepping through the code to rebuild the image
- Someone deliberately removing the watermark from an extracted file
Protect your logo.
cloakmark is built by Altokoda, and we use it on our own websites, including this one.