DEV Community

Rizmy Abdulla 🎖️
Rizmy Abdulla 🎖️

Posted on • Edited on

Unique and Random Pixel Profile Picture for Anonymous User

Live Preview

Live preview available on : https://rizmyabdulla.github.io/Anonymous-dp/

Anonymous-dp Intergration via CDN

import javascript code via : https://cdn.jsdelivr.net/gh/RizmyAbdulla/Anonymous-dp@main/index.js

<script src="https://cdn.jsdelivr.net/gh/RizmyAbdulla/Anonymous-dp@main/index.js"></script>
Enter fullscreen mode Exit fullscreen mode

Using Anonymous-dp in HTML webpage

create canvas element with id profile-picture with width 200 and height 200

<canvas id="profile-picture" width="200" height="200"></canvas>
Enter fullscreen mode Exit fullscreen mode

you can save profile image by a creating a button Element with id save-dp

<button id="download-dp">Download dp</button>
Enter fullscreen mode Exit fullscreen mode

if you want to generate DP with a button Element,use id generate-dp.

<button id="generate-dp">Generate dp</button>
Enter fullscreen mode Exit fullscreen mode

if you want to submit this Profile picture in form, use class name submit-dp to a input button type Element.

<form action="post">
   <input type="button" class="submit-dp" value="Submit" />
</form>
Enter fullscreen mode Exit fullscreen mode

Top comments (3)

Collapse
 
rizmyabdulla profile image
Rizmy Abdulla 🎖️ •

Anonymous-dp is updated to V2.checkout in my github repository.

But some functionalities and docs are still under development.you can support me by contributing this project

Collapse
 
tuntematonsotilas profile image
Tuntematon Sotilas •

Nice 👌 I would love to see something like this but with initials letters 😍

Collapse
 
rizmyabdulla profile image
Rizmy Abdulla 🎖️ •

hmm,i will add that feature