theimg

The last image element you'll ever need.

Scale, resize, crop, apply filters and other manipulations to your images on the fly.

Install

npm i theimg

Usage

import { Image } from "theimg/react";

export function App() {
  return (
    <Image
      {/* Register images at https://theimgcdn.com */}
      id="f724a94b-4046-4862-8f17-002364866d76"

      {/* Choose between jpg, webp, png, ... */}
      format="webp"

      {/* Apply transformations */}
      transform={{
        width: 200,
        height: 400,
        fit: "cover",
        position: "left"
      }}
    />
  )
}