DEV Community

Rizmy Abdulla πŸŽ–οΈ
Rizmy Abdulla πŸŽ–οΈ

Posted on • Updated 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