See what's launched

The next gen Gatsby is here Performance, developer velocity, and scaling to meet Enterprise needs - See what’s launched

Sign Up for Free
Community Plugin
View plugin on GitHub

Gatsby SQIP plugin

Generates vectorized primitive version of images to be used as preview thumbnails.

:hand: Usage

GraphQL

image {
  sqip(numberOfPrimitives: 3, blur: 0),
  resolutions {
    ...GatsbyContentfulResolutions_withWebp_noBase64
  }
}

React

Pure HTML

Coming soon. Doing some preparations first.

Gatsby Image

const Img = require(`gatsby-image`)

<Img
  resolutions={{
    ...image.resolutions,
    base64: image.sqip
  }}
/>
© 2022 Gatsby, Inc.