sfumatura del testo

aspettando il w3c...

CSS3 ci ha ormai abituati a importanti effetti grafici: i bordi arrotondati (border-radius), l'ombreggiatura dei box (box-shadow), l'ombreggiatura del testo (text-shadow) e le sfumature (linear-gradient e radial-gradient): ci sarebbe una lacuna da colmare, le sfumature del testo.

ormai per molti browsers

In un primo tempo ci aveva pensato solo la famiglia dei webkit (Chrome, Safari). ma ormai quasi tutti i browsers sanno riconoscere questa sintassi:

font-size: 36px; background: linear-gradient(to top, #E4D181 8%, #E9D07C 20%, #68551A 120%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; -moz-background-clip: text; -moz-text-fill-color: transparent;

testo sfumato (in molti browsers).

Con sintassi semplificata: style="font-size: 36px; background: linear-gradient(to bottom, #E9D07C 20%, #68551A 120%); color: transparent; -webkit-background-clip: text; background-clip: text;"

Testo sfumato

Per collocarlo su uno sfondo diverso, occorre collocarlo in un contenitore (una p in una div, per esempio, come nel primo esempio).

Nota bene: si può aggiungere un text-shadow, benchè settato su text-fill-color: transparent:

testo sfumato e ombrato.

C'è poi il problema degli altri browsers, in attesa che il w3c definisca questo standard.

un testo sfumato in puro css

testo sfumato in puro css (anche per FF, IE e Opera).

Il problema è che questa sfumatura è rigorosamente solo in bianco e nero. Il che la rende di fatto inutile...

Non riesce invece un uso combinato (positivo e negativo) del text-shadow: non ci siamo...; e neanche così:testo dorato?