imagekit-integrations

Original：🇺🇸 English

Translated

Index of ImageKit SDKs, plugins, and integrations — front-end, back-end, mobile, CMS, external storage, video player, media library & upload widgets, AI/automation, and URL generation. Use to find the right integration for a technology and what it covers, then query search_docs for implementation details.

1installs

Sourceimagekit-developer/skills

Added on2026-08-11

NPX Install

npx skill4agent add imagekit-developer/skills imagekit-integrations

SKILL.md Content

View Translation Comparison →

ImageKit Integrations

ImageKit ships SDKs (front-end, back-end, mobile), no-code plugins (CMS, e-commerce), external-storage connectors, a video player, embeddable widgets, AI/automation tooling, and direct URL-generation helpers. This skill is an index of all of them and what each covers.

When to use this skill

You're integrating ImageKit into an app and need to know which SDK, plugin, player, or widget exists for your stack.
You want a quick sense of what a given integration can do before committing.
You need to route a "how do I integrate ImageKit with X" question to the right place.

How to use this skill

Skim the sections below — they're grouped by integration type (SDKs, plugins, storage, player, widgets, automation, URL generation). Find the one that matches your stack or use case and read its summary to confirm it fits.
For implementation details, query
mcp_imagekit_devtools_search_docs
with the
```
imagekit_guides
```
and
```
imagekit_sdk
```
sources — e.g. "generate signed URLs in Node.js" or "responsive srcset in React". This returns only the relevant snippets and is far cheaper and faster than loading a whole page.
Only fetch a full doc page (append
```
.md
```
to its URL for plain text) when you genuinely need the entire setup guide end-to-end. Prefer
```
search_docs
```
for everything else.

SDKs

Front-End

For web apps that generate optimized URLs and upload from the browser. Covers:

Loading optimized images & videos with automatic format/quality
Resize, crop, and chained transformations (multiple ops in one request)
Text, image, video, and subtitle overlays
Responsive images (
```
srcset
```
/
```
sizes
```
), lazy loading, and low-quality placeholders (LQIP)
Client-side upload with tagging and metadata

All front-end SDKs wrap the JavaScript SDK — drop down to it directly when you need full control.

Tech	Guide
JavaScript	Vanilla / browser
React	React components & hooks
Next.js	App & Pages router
Vue.js	Vue components
Angular	Angular components
Astro	Astro components
React Native	Mobile web/native

Back-End

For servers that build URLs, secure delivery, and manage the media library. Covers:

URL construction with transformations
Signed URLs for secure, time-limited delivery of private media
Generating auth params (
```
token
```
,
```
expire
```
,
```
signature
```
) so the client can upload securely
File upload, tagging, and metadata operations
Developer-friendly wrappers over the media management APIs (list, search, move, delete, versions, etc.)

Tech	Guide
Node.js	JS/TS runtime
Python	Python SDK
Java	Java SDK
PHP	PHP SDK
Ruby	Ruby (+ Rails, CarrierWave)
.NET	.NET SDK
Go	Go SDK

Mobile

Native SDKs for iOS and Android. Covers:

URL construction for optimized images & videos, including adaptive bitrate (ABR) video streaming
Media loading — the Android SDK integrates with Glide, Picasso, Coil, and Fresco
Responsive image loading
Upload with an upload policy (network type, retry behavior, etc.)
Pre-upload preprocessing to control file size and dimensions

The iOS SDK currently trails Android on features.

Tech	Guide
Android	Glide/Picasso/Coil/Fresco
iOS	Swift SDK

No-code Plugins & Storage

CMS & E-commerce

Native plugins that route media through ImageKit from your existing platform — automatic optimization, responsive delivery, and CDN caching without writing integration code.

Platform	Guide
WordPress	WP plugin
Shopify	Shopify app
Magento	Magento extension
Strapi	Strapi provider
Contentful	Contentful app
Sanity	Sanity plugin
Netlify	Netlify integration

External Storage (origins)

Connect your existing storage as an ImageKit origin so it optimizes and delivers files already there — no re-uploading or migration needed.

Provider	Guide
AWS S3	S3 bucket origin
Google Cloud Storage	GCS bucket origin
Azure Blob Storage	Azure container origin
Firebase Storage	Firebase origin
DigitalOcean Spaces	Spaces origin
Web server / proxy	Any HTTP origin

Player & Widgets

Video Player SDK

A drop-in video player built on Video.js with ImageKit-powered features. Covers:

Adaptive bitrate streaming and seek-preview thumbnails
AI-generated subtitles & chapters (speech-to-text in 50+ languages, word-level highlighting)
Shoppable videos — overlay product hotspots on playback
Playlists & recommendations
Floating/sticky player and responsive layouts

Ask

search_docs

things like "embed ImageKit video player in React", "auto-generate chapters in the video player", or "add shoppable product hotspots to a video".

Embeddable Widgets

Embeddable Media Library widget — drop ImageKit's media library picker into your own app so users browse and select assets. Query e.g. "embed media library widget and handle the selected asset callback".
Upload widget — Uppy-based widget to upload from local files, URLs, Dropbox, Google Drive, Instagram, and more straight to your media library.

AI & Automation

Build with AI — agent skills + two MCP servers (DevTools for docs/transformations, API for managing your media library) for Claude, Cursor, Windsurf, VS Code Copilot, and Codex.
n8n — workflow automation.

URL generation

Beyond the SDKs, ImageKit exposes URL endpoint functions for building and signing delivery URLs directly. Useful when you only need URL construction without pulling in a full SDK. Query e.g. "sign a delivery URL with an expiry" or "build a transformation URL with overlays".

Query

mcp_imagekit_devtools_search_docs

for implementation details on any of the above integrations, players, widgets, and URL functions. For example: "generate signed URLs in Node.js", "responsive srcset in React", or "embed the video player with auto subtitles".