Installation

Choose the installation method that best fits your project.

package_2

NPM Package

Install our official SDK for the best developer experience with TypeScript support.

Terminal

# Using npm
npm install @imgfast/core

# Using yarn
yarn add @imgfast/core

# Using pnpm
pnpm add @imgfast/core

Framework-specific packages

# React / Next.js
npm install @imgfast/react

# Vue / Nuxt
npm install @imgfast/vue

# Node.js (server-side)
npm install @imgfast/node

code

CDN Script

For simple projects or quick prototyping, include our script directly.

HTML

<!-- Add before closing </body> tag -->
<script src="https://cdn.imgfast.io/sdk/imgfast.min.js"></script>
<script>
  imgfast.init({
    publicKey: 'YOUR_PUBLIC_KEY'
  });
</script>

link

Direct URL Usage

No installation needed! Simply use our CDN URLs directly in your HTML.

HTML

<!-- Direct usage in img tags -->
<img
  src="https://cdn.imgfast.io/YOUR_PUBLIC_KEY/image.jpg?w=800&f=auto"
  alt="Optimized image"
/>

<!-- With responsive images -->
<picture>
  <source
    srcset="https://cdn.imgfast.io/YOUR_PUBLIC_KEY/image.jpg?w=400&f=avif 400w,
            https://cdn.imgfast.io/YOUR_PUBLIC_KEY/image.jpg?w=800&f=avif 800w"
    type="image/avif"
  />
  <img src="https://cdn.imgfast.io/YOUR_PUBLIC_KEY/image.jpg?w=800" alt="..." />
</picture>

settings

Environment Setup

Configure your environment variables for secure API access.

.env

# Public key (safe to expose in client)
NEXT_PUBLIC_IMGFAST_PUBLIC_KEY=imgfast_pk_xxxxxxxx

# Secret key (server-side only!)
IMGFAST_SECRET_KEY=imgfast_sk_xxxxxxxxxxxxxxxx

# Optional: Custom CDN domain
IMGFAST_CDN_URL=https://cdn.imgfast.io

warning

Security Warning

Never expose your secret key in client-side code. Only use it in server-side environments.