Live Demo

Interactive Pixu demos with real sample images. Same visual language as the framework examples.

Compress with PIXU (TECR)

Try it live

Pick a sample or upload your own image

Try a sample image

Vue component

Vue component — live

PixuCompressor with real sample images

Click or drag image here to compress

Supports JPEG, PNG, WEBP, AVIF, PIXU

Or try a real sample

What you can try

• Click any sample photo (mountains, portrait, city, forest, food, PNG)
• Or upload your own image
• Side-by-side original vs compressed
• Download the .webp / .jpg (or other format) result

Recommended settings

Goal	Options
Best compression	{ format: 'image/pixu', enableSmartQuality: true }
Web photos	{ preset: 'web' }
Social media	{ preset: 'social-media', maxWidth: 1080 }
Thumbnails	{ preset: 'thumbnail' }

Component code

<template>
  <PixuCompressor
    :samples="sampleImages"
    :options="{
      format: 'image/pixu',
      enableSmartQuality: true,
      stripMetadata: true,
    }"
    @compress="handleCompress"
  />
</template>

Framework playgrounds

Framework	Docs page	Local app
Vue	live VueDemo	:3000
React	live ReactDemo	:3001
Angular	live AngularDemo	:4200
Svelte	live SvelteDemo	:3002
Jacaré	code + API	:3003

Build first: npm run build from the repo root.

Next steps

• TECR theory
• PIXU Format
• All framework examples
• API Reference