Add the Photoshop CS3 Bevel & Emboss effect to text

[alasdair009]

I was wondering how close one can get css styles to produce a 3D Gradient coloured text like the one shown here:

http://www.runescape.com/img/rs3/titles/news.png

I have been trying but cannot get it even close yet. If I could get that bevel effect making the characters jump out the page like that it would be a massive win though.

[Paulie_D]

Your link does not work.

Unfortunately, gradient text is very hard in CSS.

Sometimes an image is the best way. :)

[alasdair009]

Your link does not work.

Hi Paulie_D,

Odd it works for me – ok I mean the silver title on:

http://services.runescape.com/m=news/
or
http://services.runescape.com/m=hiscore/overview

Is there a way go make the text bevel out like that?

[Paulie_D]

Nope…not really with pure CSS on standard text that has much cross browser support..AFAIK.

Try googling “gradient text css”

That said, you might be able to make it as an SVG element…but that’s pretty much the same as using an image.

[Author]

Posts