placeholder-img-generator

A nodeJS module for creating placeholders images

Usage no npm install needed!

<script type="module">
  import placeholderImgGenerator from 'https://cdn.skypack.dev/placeholder-img-generator';
</script>

README

Welcome to placeholder-img-generator 👋

Version Documentation Maintenance License: ISC

A simple nodeJS module for creating placeholders images using canvas.

https://www.npmjs.com/package/placeholder-img-generator

Install

npm i placeholder-img-generator

Usage

  • braids(options)

Allows you to generate a placeholder made up of several ribbons that intersect with pretty shadows. Code adapted from this article

Options :

{
  width: Number,
  height: Number,
  bgColor: String,
  crossingProbability: Number,
  stringThickness: Number
}

Example :

const fs = require('fs')
const generator = require('placeholder-img-generator');

generator.braids().then((buffer) => {

    fs.writeFile(`./braids.png`, buffer, () => {
        console.log('finished generating!')
    });

})

Braids

  • cellularAutomata(options)

Allows to generate a placeholder formed by a pattern of several squares of colors. Code adapted from generativeartistry.com

Options :

{
  width: Number,
  height: Number,
  colors: Array,
}

Example :

const fs = require('fs')
const generator = require('placeholder-img-generator');

generator.cellularAutomata().then((buffer) => {

    fs.writeFile(`./cellularAutomata.png`, buffer, () => {
        console.log('finished generating!')
    });

})

cellularAutomata

  • circlePacking(options)

Generates a placeholder formed by a pattern of several circles. Code adapted from generativeartistry.com

Options :

{
  width: Number,
  height: Number,
  colors: Array
}

Example :

const fs = require('fs')
const generator = require('placeholder-img-generator');

generator.circlePacking().then((buffer) => {

    fs.writeFile(`./circlePacking.png`, buffer, () => {
        console.log('finished generating!')
    });

})

circlePacking

  • color(options)

generates an image of a solid color drawn at random. Options :

{
  width: Number,
  height: Number,
  color: String
}

Example :

const generator = require('placeholder-img-generator');

generator.color().then((buffer) => {

    fs.writeFile(`./color.png`, buffer, () => {
        console.log('finished generating!')
    });

})

color

  • cubicDisarray(options)

Generates a placeholder formed by several squares in disorder. Code adapted from generativeartistry.com Options :

{
  width: Number,
  height: Number,
  colors: Array
}

Example :

const generator = require('placeholder-img-generator');

generator.cubicDisarray().then((buffer) => {

    fs.writeFile(`./cubicDisarray.png`, buffer, () => {
        console.log('finished generating!')
    });

})

color

  • gradient(options)

Generates a cool gradient placeholder

Options :

{
  width: Number,
  height: Number,
}

Example :

const generator = require('placeholder-img-generator');

generator.gradient().then((buffer) => {

    fs.writeFile(`./gradient.png`, buffer, () => {
        console.log('finished generating!')
    });

})

color

  • hypnoticSquares(options)

Generates a cool placeholder with hypnotic squares.

Options :

{
  width: Number,
  height: Number,
  colors: Array
}

Example :

const generator = require('placeholder-img-generator');

generator.hypnoticSquares().then((buffer) => {

    fs.writeFile(`./hypnoticSquares.png`, buffer, () => {
        console.log('finished generating!')
    });

})

color

  • joyDivision(options)

Generates a placeholder composed of several small randomly generated waves. Code adapted from generativeartistry.com

Options :

{
  width: Number,
  height: Number,
  colors: Array
}

Example :

const generator = require('placeholder-img-generator');

generator.joyDivision().then((buffer) => {

    fs.writeFile(`./joyDivision.png`, buffer, () => {
        console.log('finished generating!')
    });

})

color

  • matrix(options)

Generates a placeholder composed of several green characters cascades as in the film matrix. Options :

{
  width: Number,
  height: Number,
}

Example :

const generator = require('placeholder-img-generator');

generator.matrix().then((buffer) => {

    fs.writeFile(`./matrix.png`, buffer, () => {
        console.log('finished generating!')
    });

})

color

  • mondrian(options)

Generates a placeholder looking like Mondrian's works. Code adapted from generativeartistry.com Options :

{
  width: Number,
  height: Number,
  colors: Array
}

Example :

const generator = require('placeholder-img-generator');

generator.mondrian().then((buffer) => {

    fs.writeFile(`./mondrian.png`, buffer, () => {
        console.log('finished generating!')
    });

})

color

  • noise(options)

Generates an image filled with digital noise Options :

{
  width: Number,
  height: Number,
  opacity: Number
}

Example :

const generator = require('placeholder-img-generator');

generator.noise().then((buffer) => {

    fs.writeFile(`./noise.png`, buffer, () => {
        console.log('finished generating!')
    });

})

color

  • pollock(options)

Generates a placeholder looking like Pollock's work. Code inspired by @curator_machine

Options :

{
  width: Number,
  height: Number,
}

Example :

const generator = require('placeholder-img-generator');

generator.pollock().then((buffer) => {

    fs.writeFile(`./pollock.png`, buffer, () => {
        console.log('finished generating!')
    });

})

color

  • tiledLines(options)

Generates a placeholder composed of several lines forming a kind of random maze. Code adapted from generativeartistry.com Options :

{
  width: Number,
  height: Number,
  colors: Array
}

Example :

const generator = require('placeholder-img-generator');

generator.tiledLines().then((buffer) => {

    fs.writeFile(`./tiledLines.png`, buffer, () => {
        console.log('finished generating!')
    });

})

color

  • triangularMesh(options)

Generates a placeholder composed of triangles that together form a patern. Code adapted from generativeartistry.com Options :

{
  width: Number,
  height: Number,
  gap: Number,
  colors: Array
}

Example :

const generator = require('placeholder-img-generator');

generator.triangularMesh().then((buffer) => {

    fs.writeFile(`./triangularMesh.png`, buffer, () => {
        console.log('finished generating!')
    });

})

color

  • unDeuxTrois(options)

Generates a placeholder composed of more or less organized lines. Code adapted from generativeartistry.com Options :

{
  width: Number,
  height: Number,
  colors: Array
}

Example :

const generator = require('placeholder-img-generator');

generator.unDeuxTrois().then((buffer) => {

    fs.writeFile(`./unDeuxTrois.png`, buffer, () => {
        console.log('finished generating!')
    });

})

color

Author

👤 Simon Leclere

🤝 Contributors

Contributions, issues and feature requests are welcome!
Feel free to check issues page.

Show your support

Give a ⭐️ if this project helped you!

📝 License

Copyright © 2020 Simon Leclere.
This project is MIT licensed.

This README was generated with ❤️ by readme-md-generator