Ritaglia immagine online

Ritaglia JPG, PNG, WebP o AVIF in qualsiasi proporzione: 1:1, 16:9, 9:16, 4:5, 3:2, 4:3 o pixel personalizzati.

o trascina l'immagine qui

Informazioni su questo strumento

Ritaglia qualsiasi immagine in un'area rettangolare nel tuo browser con lo strumento di ritaglio di Araluma, basato su cropperjs v2. Trascina un file JPG, PNG, WebP o AVIF sulla pagina e il canvas di ritaglio si apre immediatamente. Sposta le maniglie per posizionare la selezione, blocca una proporzione (1:1, 16:9, 9:16, 4:5, 3:2, 4:3 o A4) oppure digita dimensioni esatte in pixel e la cornice si adatta. La lettura in tempo reale mostra le dimensioni di output in pixel reali della sorgente prima di scaricare. La tua immagine resta sempre sul tuo dispositivo: la scheda Network in DevTools mostra zero richieste di immagini in uscita durante il ritaglio. Gli output PNG e WebP preservano la trasparenza del file originale, mentre l'output JPG sostituisce le aree trasparenti con uno sfondo bianco. I metadati EXIF vengono rimossi da ogni esportazione. Questo strumento è pensato per chi ha bisogno di un ritaglio rettangolare veloce e preciso senza installare software, un file alla volta.

Ritaglia immagine
Come funziona lo strumento di ritaglio nel tuo browser

Come funziona lo strumento di ritaglio nel tuo browser

La tua immagine viene aperta direttamente dal browser tramite l'API File. Nessun caricamento sul server e nessuna copia temporanea conservata fuori dal tuo dispositivo. Trascina la cornice di ritaglio nella posizione che ti serve, ridimensionala dagli angoli o dai bordi e la lettura in pixel si aggiorna mentre trascini. Le coordinate sono nello spazio pixel dell'immagine sorgente, quindi il numero mostrato è la dimensione letterale del file di output. Apri DevTools e vai sulla scheda Network mentre ritagli: non compare nessuna richiesta di immagine in uscita. Il file che trascini e il file che scarichi restano entrambi interamente sul tuo dispositivo per tutta la sessione.

Ritaglia immagine
Blocca una proporzione o inserisci dimensioni esatte in pixel

Blocca una proporzione o inserisci dimensioni esatte in pixel

Tocca un chip di proporzione (1:1 per quadrato, 16:9 per widescreen, 9:16 per ritratto, 4:5, 3:2, 4:3 o A4) e la cornice di selezione si blocca su quella proporzione. Trascinala ovunque sull'immagine per scegliere quale parte mantenere. Per centrare un target preciso in pixel, digita larghezza e altezza nei campi delle dimensioni e la cornice si ridimensiona di conseguenza. Il minimo della selezione corrisponde al limite intrinseco dell'elemento di selezione di cropperjs v2. L'output equivale sempre alla dimensione della selezione in pixel sorgente. Lo strumento non esegue upscaling: se la tua selezione è larga 600 px, il file di output è largo 600 px.

Ritaglia immagine
L'output JPG sostituisce la trasparenza con il bianco

L'output JPG sostituisce la trasparenza con il bianco

Se il tuo file sorgente ha aree trasparenti (PNG, WebP con alpha o AVIF con alpha) e scegli JPG come formato di output, quei pixel trasparenti vengono riempiti di bianco. JPG non ha canale alpha, quindi non c'è nessun posto dove la trasparenza possa essere conservata. Per preservare la trasparenza, scegli PNG, WebP o AVIF nel selettore di formato della schermata finale. Gli output PNG e WebP trasportano il canale alpha originale invariato. Anche AVIF supporta l'alpha. Il selettore di formato etichetta ogni opzione in modo che il compromesso sia visibile prima di scaricare.

Ritaglia immagine
Sposta la selezione con precisione usando la tastiera

Sposta la selezione con precisione usando la tastiera

Premi Tab fino alla cornice di ritaglio, poi usa i tasti freccia per spostare la selezione un pixel alla volta. Tieni premuto Maiusc e il passo aumenta a dieci pixel. Questa navigazione da tastiera è integrata in cropperjs v2 come funzionalità nativa, non un livello di accessibilità separato. È utile quando ti serve un allineamento visivo sub-pixel che un trackpad non riesce a garantire, oppure quando lavori con una configurazione solo da tastiera. La selezione risponde anche al tocco su mobile: pizzica per zoomare il canvas, poi trascina gli angoli della selezione per riquadrare. Nessuna modalità extra da abilitare in entrambi i casi.

Ritaglia immagine
Formati di output: PNG, JPG, WebP e AVIF

Formati di output: PNG, JPG, WebP e AVIF

Dopo aver ritagliato, scegli il formato di download nella schermata finale. PNG è lossless e preserva la trasparenza. JPG applica una compressione lossy con qualità 0,9 di default, visivamente indistinguibile dalla sorgente sulla maggior parte delle foto. WebP bilancia modalità lossless e lossy e supporta anche la trasparenza. AVIF viene codificato tramite la libreria @jsquash/avif a qualità 0,9. Produce il file più piccolo a parità di qualità visiva, ma la prima codifica AVIF nella sessione richiede un download WASM una tantum di 870 KB. Il formato di output predefinito corrisponde al tuo input: un input PNG predefinisce un output PNG, un input JPG predefinisce JPG. Puoi cambiarlo in qualsiasi momento nella schermata finale.

Ritaglia immagine
Quando usare uno strumento di ritaglio diverso

Quando usare uno strumento di ritaglio diverso

Questo strumento ritaglia solo rettangoli: quadrati, proporzioni orizzontali, proporzioni verticali e dimensioni in pixel personalizzate. Per un ritaglio circolare, una foto profilo con angoli trasparenti, usa invece Ritaglio Circolare. Condivide la stessa elaborazione lato browser ma produce un PNG rotondo. Per preset specifici di piattaforma con le dimensioni predefinite già impostate (Instagram 1080x1080, miniatura YouTube 1280x720, copertina Facebook 1200x630), le pagine di ritaglio con preset nella famiglia Crop si aprono con quelle dimensioni precaricate, così non devi calcolare nulla. Se la tua immagine deve cambiare formato senza essere prima ritagliata, usa lo strumento Converti per arrivare a PNG, JPG, WebP o AVIF.

Come ritagliare una foto in cerchio

  1. Trascina la tua immagine

    Apri lo strumento e trascina il tuo file JPG, PNG, WebP o AVIF sull'area di caricamento, oppure clicca per sfogliare il file sul tuo dispositivo.

  2. Scegli una proporzione o una dimensione in pixel

    Tocca un chip di proporzione (1:1, 16:9, 9:16, 4:5, 3:2, 4:3 o A4) o digita dimensioni esatte in pixel nei campi larghezza e altezza per impostare la cornice di ritaglio.

  3. Posiziona la cornice

    Trascina la cornice di ritaglio sull'area dell'immagine che vuoi mantenere, poi ridimensiona dagli angoli o dai bordi fino a quando la lettura in tempo reale mostra la dimensione di output che ti serve.

  4. Ritaglia e scarica

    Clicca su Ritaglia, scegli il formato di output (PNG, JPG, WebP o AVIF) nella schermata finale e scarica il file ritagliato sul tuo dispositivo.

Domande frequenti

Come si ritaglia un'immagine online?

Trascina la tua immagine sullo strumento di ritaglio, scegli una proporzione o digita le dimensioni in pixel, sposta la cornice di selezione sull'area che vuoi mantenere, poi clicca Ritaglia e scarica. L'intero processo avviene nel tuo browser. Un ritaglio tipico, dal caricamento al download, richiede meno di dieci secondi su un dispositivo moderno.

Come posso ritagliare un'immagine PNG mantenendo la trasparenza?

Carica il PNG nello strumento di ritaglio, imposta la proporzione o le dimensioni, posiziona la cornice e clicca Ritaglia. Nella schermata finale seleziona PNG come formato di output per mantenere il canale alpha intatto. Se scegli JPG, le aree trasparenti vengono sostituite con uno sfondo bianco. L'output PNG è lossless, quindi non si perde nessuna qualità di pixel durante il ritaglio.

Come ritaglio le foto per Instagram senza un'app?

Apri lo strumento di ritaglio nel browser, carica la foto e tocca il chip 1:1 per un post quadrato di Instagram o il chip 4:5 per un post verticale. Sposta la cornice per inquadrare il soggetto, clicca Ritaglia e scarica. L'output è dimensionato in base ai pixel sorgente della selezione. Per una Storia o un Reel di Instagram, usa invece la proporzione 9:16.

Quali sono le migliori proporzioni per ritagliare immagini per i social media?

Usa 1:1 per un post quadrato Instagram, 4:5 per un post verticale che occupa più spazio nel feed, 9:16 per Storia o Reel e 16:9 per una miniatura YouTube o un'intestazione Twitter. Le copertine Facebook funzionano meglio alla dimensione 1200x630 pixel, vicina a una proporzione 2:1. Lo strumento di ritaglio ha chip per 1:1, 16:9, 9:16, 4:5, 3:2 e 4:3, oltre all'inserimento di pixel personalizzati.

Posso ritagliare un'immagine in un cerchio con questo strumento?

No, questo strumento ritaglia solo rettangoli: quadrati, orizzontali, verticali e dimensioni personalizzate. Per un ritaglio circolare con sfondo trasparente, usa invece lo strumento Ritaglio Circolare. Usa la stessa elaborazione lato browser, quindi la tua immagine resta sul tuo dispositivo, ma produce un PNG rotondo con angoli trasparenti invece di un rettangolo.

Come ritaglio un'immagine a una dimensione in pixel esatta?

Digita la larghezza e l'altezza target nei campi delle dimensioni sul canvas di ritaglio. La cornice si ridimensiona di conseguenza e la lettura in tempo reale conferma la dimensione di output in pixel sorgente. L'output equivale sempre alle dimensioni in pixel sorgente della selezione. Lo strumento non esegue upscaling: se la selezione è più piccola del tuo target, anche l'output sarà più piccolo.

I dettagli

Note del team su artigianato, formati e le piccole decisioni dietro un buon ritaglio rotondo.

La libreria cropperjs v2 e cosa è cambiato dalla v1
Questo strumento è costruito su cropperjs versione 2.1.1, una riscrittura completa della libreria cropperjs originale. La release v2 sostituisce la vecchia API basata su costruttore (new Cropper(img, { aspectRatio: 1 })) con un'architettura a Web Components. Il canvas di ritaglio, l'overlay di selezione e l'elemento immagine sono tutti elementi HTML custom registrati tramite CustomElementRegistry del browser. Questo significa che lo Shadow DOM gestisce tutti gli stili interni: non esiste un file cropper.css separato da importare, eliminando una richiesta di asset Vite rispetto alla v1. Il blocco della proporzione ora si imposta sull'elemento di selezione stesso (cropperSelection.aspectRatio = 1) anziché sul costruttore, quindi la proporzione può essere cambiata a runtime senza re-inizializzare l'intera interfaccia di ritaglio. La libreria pesa 41.960 byte raw e 12.175 byte gzip, misurati direttamente dall'header content-length della CDN jsDelivr. Quei 12 KB si pagano una volta per sessione e vengono riutilizzati su tutte le rotte preset di ritaglio grazie al chunk splitting di Vite.
Come vengono calcolate le dimensioni in pixel di output (nessun upscaling)
Quando trascini la selezione di ritaglio sullo schermo, le coordinate che vedi sono nello spazio pixel dell'immagine sorgente, non nello spazio dei pixel CSS. Questa distinzione conta sugli schermi ad alta densità: un telefono con device pixel ratio 3x mostra un'immagine larga 300 pixel CSS come 900 pixel reali, ma le coordinate della selezione riflettono i 900 pixel reali, non i 300 CSS. Il file di output che scarichi contiene esattamente il numero di pixel che il rettangolo di selezione rappresenta nell'immagine sorgente. L'operazione di ritaglio chiama selection.$toCanvas() dall'API di cropperjs v2, un metodo asincrono che restituisce un nuovo HTMLCanvasElement dimensionato sui pixel della selezione. Quel canvas viene poi passato a canvas.toBlob() per PNG, JPG o WebP, oppure all'encoder @jsquash/avif per AVIF. Non viene inserito nessun passaggio di upscaling. Se la selezione è larga 800 pixel, l'output è largo 800 pixel. I preset per social media (1080x1080 per Instagram, 1280x720 per YouTube) sono consegnati a quelle dimensioni solo quando l'immagine sorgente contiene pixel sufficienti a riempire la selezione.
Rimozione dei metadati EXIF e cosa si perde
Ogni esportazione rimuove i dati EXIF, IPTC, XMP e i profili ICC. Questo avviene a livello della pipeline canvas: il browser disegna i pixel dell'immagine decodificata su un HTMLCanvasElement e il canvas codifica un nuovo file. Il canvas non ha concetto di contenitori di metadati, memorizza solo valori di pixel e parametri di codifica. Ciò che viene rimosso include coordinate GPS, marca e modello della fotocamera, focale dell'obiettivo, impostazioni di esposizione, campi di copyright e tag del profilo colore. Il profilo colore sRGB è di fatto l'assunto fatto dal canvas: i colori sono renderizzati attraverso la pipeline display del browser e ricodificati senza profilo allegato. Per la maggior parte degli usi di pubblicazione web e social media, l'EXIF rimosso è preferibile perché i dati GPS possono esporre informazioni di posizione che l'utente non intendeva condividere. Per i flussi di lavoro di fotografia professionale dove l'accuratezza del profilo colore conta, nota che la fedeltà del profilo ICC non è preservata e per la consegna a stampa o pubblicazione andrebbe usato uno strumento di esportazione color-managed.
Cosa succede quando ritagli una GIF animata
Quando trascini una GIF animata sullo strumento di ritaglio, il browser decodifica solo il primo frame nell'elemento immagine usato dal canvas di ritaglio. Questo è un comportamento del browser, non una limitazione di cropperjs: l'HTMLImageElement non espone i singoli frame di una GIF animata a JavaScript in un modo che l'API canvas possa iterare. Il risultato è che solo il primo frame è disponibile per la selezione di ritaglio e l'output finale è un'immagine fissa nel formato che scegli nella schermata finale. Se l'input è una GIF e scegli GIF come output, l'implementazione canvas.toBlob del browser non include un encoder GIF, quindi l'output silenziosamente ripiega su PNG. Lo strumento rifiuta esplicitamente GIF come opzione di formato di output per evitare quel downgrade silenzioso. Se hai bisogno di ritagliare tutti i frame di un'animazione, ti servirebbe uno strumento che lavori frame per frame, cosa che questo strumento non supporta.
Navigazione da tastiera e accessibilità
L'elemento di selezione di cropperjs v2 implementa la navigazione da tastiera come parte della sua specifica Web Component. Una volta che premi Tab fino alla selezione di ritaglio, i tasti freccia spostano la cornice un pixel alla volta nella direzione premuta. Maiusc più un tasto freccia sposta la cornice di dieci pixel. Questa accessibilità è nativa senza workaround di screen reader o overlay JavaScript custom: l'handler della tastiera vive dentro lo shadow root dell'elemento di selezione e scatta su keydown. Conta per gli utenti che si affidano alla navigazione solo da tastiera, incluse alcune configurazioni di tecnologia assistiva, dispositivi di accessibilità motoria e flussi di precisione dove un trackpad non riesce a ottenere allineamenti sub-pixel in modo affidabile. La lettura in tempo reale dei pixel allegata alla selezione si aggiorna anche a ogni pressione di tasto, così gli utenti di screen reader con regioni aria-live sulla lettura possono sentire cambiare le dimensioni correnti. L'accessibilità da tastiera è un'area in cui questo strumento è avanti rispetto a iLoveIMG e img2go, che non implementano la navigazione a frecce nel ritaglio.
Compromessi nella scelta del formato dopo il ritaglio
Il selettore di formato nella schermata finale offre quattro opzioni. PNG è lossless: ogni pixel nell'area di ritaglio è memorizzato esattamente come è stato decodificato dalla sorgente. La dimensione del file è maggiore rispetto a JPG per lo stesso contenuto, tipicamente da tre a cinque volte maggiore per una foto. JPG applica una compressione lossy con qualità 0,9 (su una scala da 0 a 1), che corrisponde grosso modo al preset di alta qualità nella maggior parte degli editor desktop. A q0,9 la differenza tra originale e output generalmente non è visibile su un monitor standard ma il file è significativamente più piccolo. WebP con la stessa qualità produce un file circa dal 25 al 35 percento più piccolo di JPG nei nostri test di codifica, con la stessa qualità percettiva sulle foto. WebP supporta anche una modalità lossless e preserva la trasparenza. AVIF a qualità 0,9 tramite la libreria @jsquash/avif produce l'output più piccolo dei quattro formati ma la prima codifica nella sessione richiede il download di un modulo WASM da 870 KB. Le codifiche AVIF successive nello stesso tab sono veloci perché il modulo è già caricato.