imagekit-developer/skills

imagekit-integrations

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.

View source
Original skill document

Rendered from the source repository. Headings, examples, code, tables, links, and referenced images are preserved.

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

  1. 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.
  2. For implementation details, query [`mcp_imagekit_devtools_search_docs`](https://imagekit.io/docs/build-with-ai) 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.
  3. 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.

TechGuide
JavaScriptVanilla / browser
ReactReact components & hooks
Next.jsApp & Pages router
Vue.jsVue components
AngularAngular components
AstroAstro components
React NativeMobile 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.)
TechGuide
Node.jsJS/TS runtime
PythonPython SDK
JavaJava SDK
PHPPHP SDK
RubyRuby (+ Rails, CarrierWave)
.NET.NET SDK
GoGo 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.

TechGuide
AndroidGlide/Picasso/Coil/Fresco
iOSSwift 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.

PlatformGuide
WordPressWP plugin
ShopifyShopify app
MagentoMagento extension
StrapiStrapi provider
ContentfulContentful app
SanitySanity plugin
NetlifyNetlify 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.

ProviderGuide
AWS S3S3 bucket origin
Google Cloud StorageGCS bucket origin
Azure Blob StorageAzure container origin
Firebase StorageFirebase origin
DigitalOcean SpacesSpaces origin
Web server / proxyAny HTTP origin

Player & Widgets

Video Player SDK

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

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](https://imagekit.io/docs/dam/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](https://github.com/imagekit-samples/uppy-uploader)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](https://imagekit.io/docs/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](https://imagekit.io/docs/integration/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".

from this repository

More skills

All skills
imagekit-developer
Community

ai-tasks

Apply AI-powered analysis to images for business-specific tagging, metadata extraction, and quality checks using controlled vocabularies. Use when user wants to analyze images and apply structured metadata in ImageKit.

installs
1
GitHub stars
2
Updated
Jul 2
imagekit-developer
Community

imagekit-sdk-reference

TypeScript SDK reference for @imagekit/nodejs — method signatures, parameter and return types (File, Folder, CustomMetadataField), error handling, and examples. Use when writing ImageKit SDK code or calling the imagekitapi execute tool.

installs
1
GitHub stars
2
Updated
Jul 2
imagekit-developer
Community

mcp-preflight

Routing guide for ImageKit's two MCP servers (imagekitapi and imagekitdevtools) — maps each capability to the correct server and tool, and covers the routing rules (e.g. never upload local files via execute). Use before calling any ImageKit MCP tool. Covers file management, folder ops, cache purge, metadata, docs search, transformation building, and upload routing.

installs
1
GitHub stars
2
Updated
Jul 2
imagekit-developer
Community

search-docs

Guidance for searching ImageKit documentation with the searchdocs tool — how to craft effective queries, select the right sources, and handle results. Use before calling searchdocs to look up ImageKit features, APIs, configuration, pricing, or SDK examples.

installs
1
GitHub stars
2
Updated
Jul 2