Material Generator
  • Generator
  • About
  • Comment

Material Design Background Generator

A tool for generating Google's Material Design like abstract backgrounds.
From time to time, a really cool one is generated... keep refreshing and it will eventually hit you!

Monochromatic pallette only?

Pallete used



About this program

I created it since there isn't anything simmilar and I find matherial design to be a hit in terms of UI experience. It was created using canvas object and javascript with the aid of two helper libraries:

  • Paper.js - paperjs.org - a library for wrapping canvas drawing funcionalities
  • color-scheme.js - c0bra.github.io/color-scheme-js - a library for generating color schemes
The program works in this way:
  1. Randomize a color
  2. Randomize a type of scheme (monochromatic, triade, tetrade, etc)
  3. Get the scheme from pt.2 for color from pt.1
  4. Randomize and draw shapes with certain logic I wont go into, cycling its color from the randomized pallette
  5. Randomly, clone shapes and displace/scale them with certain logic I wont go into, always cycling colors from the randomized pallette
  6. Randomly, perform boolean operations between shapes


You can also check out or Argentina based software factory

  String Sistemas - we develop killer Web Apps and Mobile Apps for a broad range of industries (Logistics, Health, Gobernment, BI, among others)


Contact me

Have some feedback? Comments? Imprivements? Contact me, don't be shy