const seeded = Fiona(1322672)


Image Placeholders

Image placeholders are base64 encoded datauri stringified svg files. These strings can be used in place of a src attribute in HTML, or as background image defined in css.

// input

// output


Scalable placeholder images

With default options, the image width and height of 1000px, and The colours will be chosen randomly.

<img src={Fiona(seed).img()} style={{
  width: 100,
  height: 100,
  borderRadius: '50%'
}} />

<img src={Fiona(seed).img()} />

Custom colours and size

You can also customise colours by passing an array of objects definng gradients...

<img src={Fiona(seed).img({
  height: 200,
  width: 400,
  bg: '#d4e1ec',
  colors: [
    { start: '#d24188',
        end: '#ffe0e0' },
    { start: '#5056a9',
        end: '#d4e1ec' }
})} alt="" />