Come faccio a convertire un PNG trasparente a colori in PNG trasparente bianco (non in bianco e nero)?


8

Sto cercando di creare due stati per un'immagine. Ho un'icona png trasparente a colori e ne ho bisogno di un duplicato che sia un png trasparente 'bianco'. Questo verrà usato per un effetto di passaggio del mouse nei CSS (dissolvenza da uno all'altro). Ho già visto il risultato finale di questo, ma non sono sicuro di come realizzarlo da solo.

Non ho bisogno di B&W o desat, ma ho bisogno della versione trasparente 'bianca' pura che quando un singolo strato di colore viene messo sotto di esso, viene mostrato il dettaglio dell'icona bianca trasparente.

Qualcuno può dirmi come ottenere questo in Photoshop o simili?


È su questo argomento? Non vedo alcuna rilevanza per la fotografia. Super User sarebbe meglio?
Reid,

Non penso che questo sia un argomento, temo, non è una domanda relativa alla fotografia.

Mi dispiace, ma questo non è in argomento qui su Photo.SE. Non ci occupiamo di CSS o di modifica generale delle immagini, e questo rientra in entrambe le categorie (nonostante l'uso di Photoshop). Potresti ottenere risultati migliori su superuser.com. Potresti anche provare a consultare i siti su area51.stackexchange.com e vedere se esiste un sito beta che potrebbe offrirti un aiuto migliore. Chiuderò questa domanda come fuori tema.
jrista,

Qualcuno lo ha già pubblicato, sembra che l'aggiunta di uno stile di livello "Color Overlay" dovrebbe essere la soluzione migliore e più veloce, tuttavia ... dipende dal tipo di contenuto dell'immagine, ti dispiacerebbe aggiornare aggiungendo un'anteprima del png originale o qualcosa del genere possiamo aiutarti meglio? Grazie!
Sam,

Risposte:


11

Due approcci diversi:

  1. Utilizzare il Magic wandselettore per selezionare l'area trasparente (come selezione non contigua)
  2. Invertire la selezione
  3. Disegna un rettangolo bianco pieno sopra l'icona o Fillla selezione con il bianco
    • la selezione dovrebbe impedire le modifiche al di fuori dell'area delle icone.

O

  1. Blocca il livello trasparenza / alfa. (Questo deve essere fatto dalla palette dei livelli)

    inserisci qui la descrizione dell'immagine

  2. Disegna un rettangolo bianco pieno sopra l'icona o Filll'immagine con il bianco

    • il blocco trasparenza impedisce qualsiasi modifica alla trasparenza (ad es. il canale alfa)

testo alternativotesto alternativo

Ad ogni modo, non sono sicuro di come il risultato ti sarà utile.


1
Penso che quest'ultimo metodo sia più veloce e più preciso, lo consiglierei!
Jari Keinänen,

perché non aggiungere semplicemente lo stile di livello -> sovrapposizione di colori al bianco?
Sisir,

6

La risposta di Roddy fornisce un metodo molto rapido, ma distruttivo.

Se desideri mantenere i livelli - anche solo il livello di sfondo - nei tuoi file di origine, prendi in considerazione la creazione di un nuovo livello completamente bianco che sia Clipping maskper il livello icona stesso. Se in seguito è necessario modificare il livello icona, l'uso della maschera di ritaglio riempirà sempre i nuovi pixel di bianco o rimuoverà quelli non necessari.

Quando stai per esportare l'icona, puoi attivare o disattivare la visibilità della maschera di ritaglio per esportare entrambi i png dallo stesso file di origine.


5

In otto battute. Questa soluzione richiede CS4 o versioni successive.

Se l'immagine è un singolo livello, esegui solo i passaggi 4 e 6-8. Su Windows usa CTRL invece di CMD.

  1. Fn+ F7o F7(apri il pannello dei livelli)
  2. ALT+ CMD+ a (seleziona tutti i livelli)
  3. CMD+ g(metti i livelli in una cartella)
  4. CMD+ MAIUSC + n(crea un nuovo livello)
  5. CMD+ ](sposta il nuovo livello fuori dalla cartella)
  6. d (passa ai colori bg e fg predefiniti in bianco e nero)
  7. CMD+ delete(riempie il nuovo livello di bianco)
  8. ALT+ CMD+ g(aggancia il nuovo colore al livello o alla cartella immediatamente sotto di esso)

+1 per un approccio non distruttivo "in grado di agire".
Farray,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.