Nocturnal Parakeet Monitor

    davatar

    1.0.3 • Public • Published

    Davatar

    codecov npm version npm

    🤡 An npm package to generate avatar data-url on both client & server side, using text.

    https://nodei.co/npm/davatar.png?downloads=true&downloadRank=true&stars=true

    Contents

    Installation

    npm install davatar
    

    Usage

    Import module as given below:

    /*
    Generated imageDataUrl can be used in <img> tag 
    Or can be viewed directly through browser.
    */
    const { davatar } = require("davatar");
    const imageDataUrl50 = davatar.generate({size:50, text:"deepanshu dhruw", textColor:"blue", backgroundColor:"orange"});

    Generated Image-Data-URL:

    data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAABmJLR0QA/wD/AP+gvaeTAAACQElEQVRoge2YTUgUUQCAv9ltN3W32HVkw9LNFqJTkLhtEWQeDFqDfpAg6lDgoTwEGdExpD0FkYcO1sHoUgTRL6RBHvo5FIulYFCXFhstaWu1H1uXXdfp1CI4xAgz02t53/Hx+HgfM/Nm3ij6dXTKANe/XoBVyBDRkCGiIUNEQ4aIhgwRDRkiGjJENJaZmdQz0EV+zrto3OMuEPRN09gwzMb6UdyuoiMeIxQzB6sVHT+Zyfn/Okf1ZzjeeplT8YtU+6ds9RixpJADW27RtO5VaTybr0L7GubJ2xbGvjQAEFY1bp9sJxoZss1jhKlb6w9tm/o52nxt0biuKzx4vYfOq71omTC7zj8imYgRCaVs9SzEkoddUXT2Nt0nmYhRG5gkM6NyrO+Kox5Ld6266gkuHTkBwOCbVoZSUcc8lm+/+zffZXXwEwAPR3Y75rE8xKXMs33DcwCS72OOeWx5IYZrNADSP0KOeWwJqfDkAJjNVzrmsSXk8/dVANQGJh3z2BKSSkdML8Aqj+Uh37IBnr1rBjD9VrbCY3lI72An+TkvbleRfdF7jnksDRkea+TcnbMAHNp2g7CqOeaxJGRed3HzxUF2JJ6SK1SwJviRC4dPO+pZ0kdj/0hbaScBKBQ9TEzV8Xh0Z+nBrFfHGTgTJ7QybbtnIZadR3zLf9HR0kd3ezdB37StHiNMXZGueI/hya7SO8vamg+EVY2t619S5c064jHC1BX5Hyibnw8yRDRkiGjIENGQIaIhQ0RDhohG2YT8BpZRJq7xHedTAAAAAElFTkSuQmCC
    

    Open the generated Image-Data-URL in the browser; you'll see the following image:

    In React.js

    import React from "react";
    const { davatar } = require("davatar");
    
    function App() {
    	const imageDataUrl = davatar.generate({
    		size: 50,
    		text: "deepanshu dhruw",
    		textColor: "red",
    		backgroundColor: "cyan",
    	});
    	return <img src={imageDataUrl} alt="image"></img>;
    }
    
    export default App;

    Run the react-app and you will see below image:

    Parameters:

    Parameter Type Values Default
    size (Optional) Integer 1 - 512 64
    text (Required) String More than 2 characters
    textColor (Optional) String Color Format Random RGB Value
    backgroundColor (Optional) String Color Format Random RGB Value
    fontFamily (Optional) String Font Family "Arial"
    fontWeight (Optional) Integer 100 - 900 100

    Examples

    EXAMPLE-1

    Generating 64×64 (px) dimension image, with custom parameters:

    const { davatar } = require("davatar");
    const imageProperty = {
        size: 64,
        text: "John Doe",
        textColor: "red",
        backgroundColor: "green",
        fontFamily: "monospace",
        fontWeight: 600
    }
    const imageDataUrl = davatar.generate(imageProperty);


    EXAMPLE-2

    Generating default dimension image, with default parameters:

    const { davatar } = require("davatar");
    const imageProperty = { text: "John Doe" }
    const imageDataUrl = davatar.generate(imageProperty);

    Random textColor & backgroundColor:


    EXAMPLE-3

    Generating 128×128 (px) dimension image, with default parameters:

    const { davatar } = require("davatar");
    const imageProperty = { size: 128, text: "dd" }
    const imageDataUrl = davatar.generate(imageProperty);

    Random textColor & backgroundColor:

    Tests

    npm test
    

    License

    MIT

    Install

    npm i davatar

    DownloadsWeekly Downloads

    12

    Version

    1.0.3

    License

    ISC

    Unpacked Size

    13.9 kB

    Total Files

    13

    Last publish

    Collaborators

    • devblin