Back
Chrome Effect
Chrome-like effect with multiple gradients
<svg viewBox="0 0 600 120">
<defs>
<linearGradient id="c1" x1="0" x2="1">
<stop offset="0" stop-color="#e6eef8"/>
<stop offset="1" stop-color="#9fb0d6"/>
</linearGradient>
<linearGradient id="c2" x1="0" x2="1">
<stop offset="0" stop-color="#fff" stop-opacity="0.5"/>
<stop offset="1" stop-color="#000" stop-opacity="0.1"/>
</linearGradient>
</defs>
<rect width="100%" height="100%" fill="#ffffff"/>
<text x="50%" y="55%" font-size="44" text-anchor="middle" fill="url(#c1)" stroke="#b6c4e0" stroke-width="1">Chrome</text>
<text x="50%" y="55%" font-size="44" text-anchor="middle" fill="url(#c2)" opacity="0.25">Chrome</text>
</svg>