Author: | joyqi |
---|---|
Views Total: | 544 views |
Official Page: | Go to website |
Last Update: | May 20, 2021 |
License: | MIT |
Preview:

Description:
sfz is a JavaScript-driven online watermark tool that enables you to fill images with diagonal text watermark.
Completely based on the browser’s local API, without any network requests.
How to use it:
1. Build the HTML for the watermark tool.
<label for="image">1. Select An Image</label> <input type="file" id="image" autocomplete="off"> <label for="text">2. Watermark Text</label> <input type="text" id="text" placeholder="cssscript.com" autocomplete="off" maxlength="30"> <label for="color">Text Color</label> <input type="color" id="color" pattern="#[0-9A-Fa-f]{6}" autocomplete="off" value="#0000FF"> <label for="alpha">Opacity</label> <input type="range" id="alpha" min="0" max="1" step="0.05" autocomplete="off" value="0.15"> <label for="space">Gap</label> <input type="range" id="space" min="1" max="8" step="0.2" autocomplete="off" value="4"> <label for="size">Font Size</label> <input type="range" id="size" min="0.5" max="3" step="0.05" autocomplete="off" value="1"> <label for="text">3. Click the Image To Download</label> <p id="graph"></p>
2. Load the required JavaScript in the document. That’s it.
<script src="./build/script.js"></script>