SQIP Demo

SQIP will generate SVG based previews of images. They can be used as a lazy-loading image preview, a video thumbnail or an artistic element for your project.

Compare the new SQIP version with the old SQIP version, LQIP and a 300px thumbnail

Learn more about SQIP

ThumbnailLQIPLQIP customSQIP v0.3.3SQIP defaultSQIP pixelsSQIP primitive art

300px thumbnail of the original image, minified withmozjpeg

average processing time0.077s | ø 11.6 kB | ↓ 100.00%

Generated with lqip-cli

average processing time0.701s | ø 887 B | ↓ 7.63%

32px thumbnail generated with sharp, minified withmozjpeg

average processing time0.052s | ø 546 B | ↓ 4.70%

The old version of SQIP. For comparision to v1.0.0

average processing time3.228s | ø 754 B | ↓ 6.49%

config:
{
  "filename": "path/to/file.jpg"
}

Just the default settings

average processing time3.735s | ø 528 B | ↓ 4.54%

config:
{
  "input": "path/to/file.jpg"
}

Pixel art via sqip-plugin-pixels

average processing time0.682s | ø 712 B | ↓ 6.13%

config:
{
  "input": "path/to/file.jpg",
  "plugins": [
    "pixels",
    "svgo",
    "data-uri"
  ]
}

Primitive art with 100 triangles. More options: sqip-plugin-primitive

average processing time8.535s | ø 1.23 kB | ↓ 10.61%

config:
{
  "input": "path/to/file.jpg",
  "plugins": [
    {
      "name": "primitive",
      "options": {
        "numberOfPrimitives": 50,
        "mode": 1
      }
    },
    "svgo",
    "data-uri"
  ]
}
aaron-burden-151465-unsplash-thumbnail.jpg
100.00%

aaron-burden-151465-unsplash-thumbnail.jpg

Size: 300×225 (4:3)

original38.4 kB
gzip17.3 kB ↓55%
brotli17.2 kB ↓56%
aaron-burden-151465-unsplash-lqip.jpg
4.60%

aaron-burden-151465-unsplash-lqip.jpg

Size: 10×8 (5:4)

original1.25 kB
gzip795 B ↓37%
brotli772 B ↓39%
aaron-burden-151465-unsplash-lqip-custom.jpg
3.27%

aaron-burden-151465-unsplash-lqip-custom.jpg

Size: 32×24 (4:3)

original1.04 kB
gzip566 B ↓46%
brotli537 B ↓49%
aaron-burden-151465-unsplash-sqip-legacy.svg
4.46%

aaron-burden-151465-unsplash-sqip-legacy.svg

Size: 2000×1500 (4:3)

original1.18 kB
gzip772 B ↓35%
brotli761 B ↓36%
aaron-burden-151465-unsplash-sqip.svg
3.16%

aaron-burden-151465-unsplash-sqip.svg

Size: 300×225 (4:3)

original1.06 kB
gzip546 B ↓49%
brotli498 B ↓54%
aaron-burden-151465-unsplash-sqip-pixels.svg
3.27%

aaron-burden-151465-unsplash-sqip-pixels.svg

Size: 800×600 (4:3)

original2.66 kB
gzip566 B ↓79%
brotli411 B ↓85%
aaron-burden-151465-unsplash-sqip-art.svg
7.17%

aaron-burden-151465-unsplash-sqip-art.svg

Size: 300×225 (4:3)

original3.31 kB
gzip1.24 kB ↓63%
brotli1.1 kB ↓67%
anthony-esau-173126-unsplash-thumbnail.jpg
100.00%

anthony-esau-173126-unsplash-thumbnail.jpg

Size: 300×225 (4:3)

original24 kB
gzip10.9 kB ↓55%
brotli10.8 kB ↓56%
anthony-esau-173126-unsplash-lqip.jpg
7.35%

anthony-esau-173126-unsplash-lqip.jpg

Size: 10×8 (5:4)

original1.25 kB
gzip801 B ↓36%
brotli783 B ↓38%
anthony-esau-173126-unsplash-lqip-custom.jpg
4.88%

anthony-esau-173126-unsplash-lqip-custom.jpg

Size: 32×24 (4:3)

original953 B
gzip532 B ↓45%
brotli541 B ↓44%
anthony-esau-173126-unsplash-sqip-legacy.svg
6.95%

anthony-esau-173126-unsplash-sqip-legacy.svg

Size: 2000×1500 (4:3)

original1.27 kB
gzip757 B ↓41%
brotli746 B ↓42%
anthony-esau-173126-unsplash-sqip.svg
4.94%

anthony-esau-173126-unsplash-sqip.svg

Size: 300×225 (4:3)

original1.05 kB
gzip538 B ↓49%
brotli484 B ↓54%
anthony-esau-173126-unsplash-sqip-pixels.svg
5.15%

anthony-esau-173126-unsplash-sqip-pixels.svg

Size: 800×600 (4:3)

original2.66 kB
gzip561 B ↓79%
brotli408 B ↓85%
anthony-esau-173126-unsplash-sqip-art.svg
11.40%

anthony-esau-173126-unsplash-sqip-art.svg

Size: 300×225 (4:3)

original3.29 kB
gzip1.24 kB ↓63%
brotli1.11 kB ↓67%
aron-visuals-974734-unsplash-thumbnail.jpg
100.00%

aron-visuals-974734-unsplash-thumbnail.jpg

Size: 300×375 (5:4)

original22 kB
gzip10.1 kB ↓54%
brotli10 kB ↓55%
aron-visuals-974734-unsplash-lqip.jpg
8.97%

aron-visuals-974734-unsplash-lqip.jpg

Size: 10×13 (13:10)

original1.4 kB
gzip910 B ↓35%
brotli895 B ↓37%
aron-visuals-974734-unsplash-lqip-custom.jpg
5.02%

aron-visuals-974734-unsplash-lqip-custom.jpg

Size: 32×40 (5:4)

original916 B
gzip509 B ↓45%
brotli516 B ↓44%
aron-visuals-974734-unsplash-sqip-legacy.svg
8.01%

aron-visuals-974734-unsplash-sqip-legacy.svg

Size: 2000×2500 (5:4)

original1.43 kB
gzip812 B ↓44%
brotli802 B ↓44%
aron-visuals-974734-unsplash-sqip.svg
5.42%

aron-visuals-974734-unsplash-sqip.svg

Size: 300×375 (5:4)

original1.19 kB
gzip550 B ↓54%
brotli487 B ↓60%
aron-visuals-974734-unsplash-sqip-pixels.svg
7.90%

aron-visuals-974734-unsplash-sqip-pixels.svg

Size: 800×1000 (5:4)

original4.37 kB
gzip801 B ↓82%
brotli544 B ↓88%
aron-visuals-974734-unsplash-sqip-art.svg
12.41%

aron-visuals-974734-unsplash-sqip-art.svg

Size: 298×375 (375:298)

original3.38 kB
gzip1.26 kB ↓63%
brotli1.11 kB ↓68%
beach-thumbnail.jpg
100.00%

beach-thumbnail.jpg

Size: 300×188 (75:47)

original13.5 kB
gzip6.25 kB ↓54%
brotli6.16 kB ↓55%
beach-lqip.jpg
12.97%

beach-lqip.jpg

Size: 10×6 (5:3)

original1.27 kB
gzip811 B ↓36%
brotli787 B ↓38%
beach-lqip-custom.jpg
7.08%

beach-lqip-custom.jpg

Size: 32×20 (8:5)

original808 B
gzip443 B ↓46%
brotli416 B ↓49%
beach-sqip-legacy.svg
12.04%

beach-sqip-legacy.svg

Size: 1024×640 (8:5)

original1.29 kB
gzip753 B ↓42%
brotli745 B ↓43%
beach-sqip.svg
8.96%

beach-sqip.svg

Size: 300×188 (75:47)

original1.16 kB
gzip560 B ↓52%
brotli500 B ↓57%
beach-sqip-pixels.svg
8.08%

beach-sqip-pixels.svg

Size: 800×500 (8:5)

original2.23 kB
gzip505 B ↓78%
brotli369 B ↓84%
beach-sqip-art.svg
19.19%

beach-sqip-art.svg

Size: 300×187 (300:187)

original3.31 kB
gzip1.2 kB ↓64%
brotli1.08 kB ↓68%
charles-550068-unsplash-thumbnail.jpg
100.00%

charles-550068-unsplash-thumbnail.jpg

Size: 300×418 (209:150)

original28.1 kB
gzip12.5 kB ↓56%
brotli12.4 kB ↓56%
charles-550068-unsplash-lqip.jpg
7.43%

charles-550068-unsplash-lqip.jpg

Size: 10×14 (7:5)

original1.43 kB
gzip932 B ↓35%
brotli912 B ↓37%
charles-550068-unsplash-lqip-custom.jpg
5.19%

charles-550068-unsplash-lqip-custom.jpg

Size: 32×45 (45:32)

original1.23 kB
gzip651 B ↓48%
brotli617 B ↓50%
charles-550068-unsplash-sqip-legacy.svg
5.88%

charles-550068-unsplash-sqip-legacy.svg

Size: 2000×2785 (557:400)

original1.11 kB
gzip738 B ↓34%
brotli735 B ↓34%
charles-550068-unsplash-sqip.svg
4.03%

charles-550068-unsplash-sqip.svg

Size: 300×418 (209:150)

original994 B
gzip506 B ↓50%
brotli448 B ↓55%
charles-550068-unsplash-sqip-pixels.svg
6.85%

charles-550068-unsplash-sqip-pixels.svg

Size: 800×1100 (11:8)

original4.81 kB
gzip860 B ↓83%
brotli605 B ↓88%
charles-550068-unsplash-sqip-art.svg
9.76%

charles-550068-unsplash-sqip-art.svg

Size: 300×418 (209:150)

original3.15 kB
gzip1.23 kB ↓62%
brotli1.09 kB ↓66%
eric-marty-780304-unsplash-thumbnail.jpg
100.00%

eric-marty-780304-unsplash-thumbnail.jpg

Size: 300×300 (1:1)

original28.8 kB
gzip13.1 kB ↓55%
brotli12.9 kB ↓56%
eric-marty-780304-unsplash-lqip.jpg
7.22%

eric-marty-780304-unsplash-lqip.jpg

Size: 10×10 (1:1)

original1.44 kB
gzip944 B ↓35%
brotli923 B ↓36%
eric-marty-780304-unsplash-lqip-custom.jpg
4.13%

eric-marty-780304-unsplash-lqip-custom.jpg

Size: 32×32 (1:1)

original952 B
gzip540 B ↓44%
brotli509 B ↓47%
eric-marty-780304-unsplash-sqip-legacy.svg
6.10%

eric-marty-780304-unsplash-sqip-legacy.svg

Size: 2000×2000 (1:1)

original1.35 kB
gzip797 B ↓41%
brotli797 B ↓41%
eric-marty-780304-unsplash-sqip.svg
4.05%

eric-marty-780304-unsplash-sqip.svg

Size: 300×300 (1:1)

original1.07 kB
gzip530 B ↓51%
brotli475 B ↓56%
eric-marty-780304-unsplash-sqip-pixels.svg
5.22%

eric-marty-780304-unsplash-sqip-pixels.svg

Size: 800×800 (1:1)

original3.52 kB
gzip682 B ↓81%
brotli488 B ↓87%
eric-marty-780304-unsplash-sqip-art.svg
9.60%

eric-marty-780304-unsplash-sqip-art.svg

Size: 300×300 (1:1)

original3.38 kB
gzip1.25 kB ↓63%
brotli1.13 kB ↓67%
ian-dooley-298769-unsplash-thumbnail.jpg
100.00%

ian-dooley-298769-unsplash-thumbnail.jpg

Size: 300×450 (3:2)

original8.68 kB
gzip4.1 kB ↓53%
brotli4.02 kB ↓54%
ian-dooley-298769-unsplash-lqip.jpg
19.42%

ian-dooley-298769-unsplash-lqip.jpg

Size: 10×15 (3:2)

original1.25 kB
gzip796 B ↓37%
brotli777 B ↓38%
ian-dooley-298769-unsplash-lqip-custom.jpg
10.03%

ian-dooley-298769-unsplash-lqip-custom.jpg

Size: 32×48 (3:2)

original764 B
gzip411 B ↓47%
brotli390 B ↓49%
ian-dooley-298769-unsplash-sqip-legacy.svg
18.30%

ian-dooley-298769-unsplash-sqip-legacy.svg

Size: 2000×3000 (3:2)

original1.4 kB
gzip750 B ↓47%
brotli749 B ↓47%
ian-dooley-298769-unsplash-sqip.svg
12.03%

ian-dooley-298769-unsplash-sqip.svg

Size: 300×450 (3:2)

original960 B
gzip493 B ↓49%
brotli447 B ↓54%
ian-dooley-298769-unsplash-sqip-pixels.svg
20.13%

ian-dooley-298769-unsplash-sqip-pixels.svg

Size: 800×1200 (3:2)

original5.04 kB
gzip825 B ↓84%
brotli591 B ↓89%
ian-dooley-298769-unsplash-sqip-art.svg
30.41%

ian-dooley-298769-unsplash-sqip-art.svg

Size: 298×450 (225:149)

original3.37 kB
gzip1.25 kB ↓64%
brotli1.12 kB ↓67%
meric-dagli-487815-unsplash-thumbnail.jpg
100.00%

meric-dagli-487815-unsplash-thumbnail.jpg

Size: 300×450 (3:2)

original43.2 kB
gzip19.3 kB ↓56%
brotli19 kB ↓57%
meric-dagli-487815-unsplash-lqip.jpg
6.13%

meric-dagli-487815-unsplash-lqip.jpg

Size: 10×15 (3:2)

original1.76 kB
gzip1.18 kB ↓33%
brotli1.16 kB ↓35%
meric-dagli-487815-unsplash-lqip-custom.jpg
3.66%

meric-dagli-487815-unsplash-lqip-custom.jpg

Size: 32×48 (3:2)

original1.24 kB
gzip707 B ↓44%
brotli673 B ↓46%
meric-dagli-487815-unsplash-sqip-legacy.svg
3.78%

meric-dagli-487815-unsplash-sqip-legacy.svg

Size: 2000×3000 (3:2)

original1.22 kB
gzip730 B ↓41%
brotli717 B ↓42%
meric-dagli-487815-unsplash-sqip.svg
2.82%

meric-dagli-487815-unsplash-sqip.svg

Size: 300×450 (3:2)

original1.12 kB
gzip544 B ↓52%
brotli478 B ↓58%
meric-dagli-487815-unsplash-sqip-pixels.svg
4.92%

meric-dagli-487815-unsplash-sqip-pixels.svg

Size: 800×1200 (3:2)

original5.25 kB
gzip949 B ↓82%
brotli633 B ↓88%
meric-dagli-487815-unsplash-sqip-art.svg
6.46%

meric-dagli-487815-unsplash-sqip-art.svg

Size: 298×450 (225:149)

original3.37 kB
gzip1.25 kB ↓63%
brotli1.12 kB ↓67%
mona-lisa-thumbnail.jpg
100.00%

mona-lisa-thumbnail.jpg

Size: 300×447 (149:100)

original36.3 kB
gzip16.5 kB ↓55%
brotli16.3 kB ↓56%
mona-lisa-lqip.jpg
6.39%

mona-lisa-lqip.jpg

Size: 10×15 (3:2)

original1.59 kB
gzip1.05 kB ↓34%
brotli1.03 kB ↓36%
mona-lisa-lqip-custom.jpg
4.12%

mona-lisa-lqip-custom.jpg

Size: 32×48 (3:2)

original1.21 kB
gzip679 B ↓44%
brotli641 B ↓47%
mona-lisa-sqip-legacy.svg
4.61%

mona-lisa-sqip-legacy.svg

Size: 1200×1788 (149:100)

original1.28 kB
gzip760 B ↓41%
brotli748 B ↓42%
mona-lisa-sqip.svg
3.07%

mona-lisa-sqip.svg

Size: 300×447 (149:100)

original988 B
gzip506 B ↓49%
brotli448 B ↓55%
mona-lisa-sqip-pixels.svg
5.86%

mona-lisa-sqip-pixels.svg

Size: 800×1200 (3:2)

original5.25 kB
gzip965 B ↓82%
brotli625 B ↓89%
mona-lisa-sqip-art.svg
7.64%

mona-lisa-sqip-art.svg

Size: 300×447 (149:100)

original3.33 kB
gzip1.26 kB ↓63%
brotli1.1 kB ↓67%
quino-al-101314-unsplash-thumbnail.jpg
100.00%

quino-al-101314-unsplash-thumbnail.jpg

Size: 300×200 (3:2)

original16.6 kB
gzip7.61 kB ↓55%
brotli7.5 kB ↓55%
quino-al-101314-unsplash-lqip.jpg
8.34%

quino-al-101314-unsplash-lqip.jpg

Size: 10×7 (10:7)

original1.03 kB
gzip634 B ↓39%
brotli612 B ↓41%
quino-al-101314-unsplash-lqip-custom.jpg
6.02%

quino-al-101314-unsplash-lqip-custom.jpg

Size: 32×21 (32:21)

original840 B
gzip458 B ↓46%
brotli441 B ↓48%
quino-al-101314-unsplash-sqip-legacy.svg
9.47%

quino-al-101314-unsplash-sqip-legacy.svg

Size: 2000×1333 (2000:1333)

original1.09 kB
gzip720 B ↓34%
brotli714 B ↓35%
quino-al-101314-unsplash-sqip.svg
6.85%

quino-al-101314-unsplash-sqip.svg

Size: 300×200 (3:2)

original1.06 kB
gzip521 B ↓51%
brotli461 B ↓57%
quino-al-101314-unsplash-sqip-pixels.svg
5.76%

quino-al-101314-unsplash-sqip-pixels.svg

Size: 800×500 (8:5)

original2.18 kB
gzip438 B ↓80%
brotli314 B ↓86%
quino-al-101314-unsplash-sqip-art.svg
15.12%

quino-al-101314-unsplash-sqip-art.svg

Size: 300×199 (300:199)

original2.92 kB
gzip1.15 kB ↓61%
brotli1.04 kB ↓65%
shane-young-769905-unsplash-thumbnail.jpg
100.00%

shane-young-769905-unsplash-thumbnail.jpg

Size: 300×300 (1:1)

original22.1 kB
gzip10.1 kB ↓55%
brotli10.1 kB ↓55%
shane-young-769905-unsplash-lqip.jpg
8.85%

shane-young-769905-unsplash-lqip.jpg

Size: 10×10 (1:1)

original1.38 kB
gzip898 B ↓36%
brotli877 B ↓37%
shane-young-769905-unsplash-lqip-custom.jpg
4.99%

shane-young-769905-unsplash-lqip-custom.jpg

Size: 32×32 (1:1)

original915 B
gzip506 B ↓45%
brotli518 B ↓44%
shane-young-769905-unsplash-sqip-legacy.svg
6.96%

shane-young-769905-unsplash-sqip-legacy.svg

Size: 1024×1024 (1:1)

original1.18 kB
gzip706 B ↓41%
brotli687 B ↓42%
shane-young-769905-unsplash-sqip.svg
5.04%

shane-young-769905-unsplash-sqip.svg

Size: 300×300 (1:1)

original949 B
gzip511 B ↓47%
brotli460 B ↓52%
shane-young-769905-unsplash-sqip-pixels.svg
6.69%

shane-young-769905-unsplash-sqip-pixels.svg

Size: 800×800 (1:1)

original3.52 kB
gzip679 B ↓81%
brotli470 B ↓87%
shane-young-769905-unsplash-sqip-art.svg
12.28%

shane-young-769905-unsplash-sqip-art.svg

Size: 300×300 (1:1)

original3.27 kB
gzip1.25 kB ↓62%
brotli1.11 kB ↓66%