Preview:
import React from "react";
import ProgressiveImage from "react-progressive-image";

import image from "./image.jpg";
import placeholderImage from "./placeholderImage.jpg";

const App = () => {
  return (
    <ProgressiveImage src={image} placeholder="data:image/png;base64***">
      {(src) => <img src={src} alt="an image" />}
    </ProgressiveImage>
  );
};

export default App;
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter