Query builder for Imgix.

Installation

npm i -S @hackdoor/imgix
#or
yarn add @hackdoor/imgix

Usage

import Imgix from '@hackdoor/imgix'

const imgix = new Imgix('https://my-imgix-server-url.com')
const myImage = imgix
  .build()
  .width(300)
  .height(500)
  .fit('crop')
  .get('/my-image-path')

console.log(myImage)
// => "https://my-imgix-server-url.com/my-image-path?fit=crop&w=300&h=500"

Methods Legenda

• Adjustments
• Blending
• Size
• Format
• Rotation
• Color Palette

Available Methods

Currently available methods. Let's pretend whe have the following Imgix instance:

import Imgix from '@hackdoor/imgix'

const imgix = new Imgix('https://my-endpoint.imgix.net')

Converting S3 URL to Imgix Url

import Imgix from '@hackdoor/imgix'

const imgix = new Imgix('https://my-endpoint.imgix.net')
const myImage = imgix
  .build()
  .width(300)
  .height(500)
  .fit('crop')
  .fromS3('https://my-s3-bucket.s3.amazonaws.com/foo/bar/baz.png')

console.log(myImage)
// => "https://my-endpoint.imgix.net/foo/bar/baz.png?w=500&h=600&fit=crop"

Adjustments

Brightness

A number between -100 and 100

imgix.brightness(50)

Contrast

A number between -100 and 100

imgix.contrast(50)

Exposure

A number between -100 and 100

imgix.exposure(50)

Gamma

A number between -100 and 100

imgix.gamma(50)

Highlight

A number between -100 and 0

imgix.highlight(-50)

Hue Shift

A number between 0 and 359

imgix.hueShift(50)

Invert

A boolean value

imgix.invert(true)

Saturation

A number between -100 and 100

imgix.saturation(50)

Shadow

A number between 0 and 100

imgix.shadow(50)

Sharpen

A number between 0 and 100

imgix.sharpen(50)

Unsharp Mask

A number between -100 and 100

imgix.unsharpMask(50)

Unsharp Mask Radius

A number between -100 and 100

imgix.unsharpMaskRadius(50)

Vibrance

A number between -100 and 100

imgix.vibrance(50)

Blending

Blend

A string representing an hex color (#000) or an image url (https://example.com/img.jpg)

imgix.blend('#F500F0')

Blend Align

One of the following values: top, middle, bottom, left, center, right

imgix.blendAlign('top')

Blend Crop

One of the following values: top, middle, bottom, left, center, right, faces

imgix.blendCrop('faces')

Size

Aspect Ratio

A string in the form of W:H (width, height)

imgix.aspectRatio('16:9')

Width

A number

imgix.width(1920)

Width

A number

imgix.height(1080)

Format

Output Format

A string, one of: gif, jp2, jpg, json, jxr, pjpg, mp4, png, png8, png32, webm, webp

imgix.format('png')

Output Quality

A number between 0 and 100

imgix.quality(75)

Rotation

Flip

A string, one of: v, h and vh

imgix.flip('v')

Orient

A number between 1 and 8 or 90, 180, 270

imgix.orient(90)

Rotation

A number between 0 and 359

imgix.rotation(180)

Color Palette

Colors

A number between 0 and 16

imgix.colors(5)

Palette

A string, one of: css, json

imgix.palette('json')

Auto

A string, one of: compress, enhance, format, redeye

imgix.auto('compress')

License

Licensed under the GPLv3 license.