Sign Up
Log In

CSS text-shadow online generator for free

Share
vkontakte
odnoklassniki
twitter
facebook
gplus
mail
CSS box-shadow online generator
CSS 3d text online generator

It could be easy and quick to create shadow text for any html-page element with this CSS text-shadow generator.

Block example
Code:
{
filter: progid:DXImageTransform.Microsoft.DropShadow(offX=1, offY=1, color=#000000, positive=true);
text-shadow:1px 1px 1px 1px rgba(0,0,0,1);
-webkit-text-shadow:1px 1px 1px 1px rgba(0,0,0,1);
-moz-text-shadow:1px 1px 1px 1px rgba(0,0,0,1);
}
px
px
px
px

This generator creates CSS code, which will needed apply to the right element with shadow text effect. There are some properties when you create text shadows:

  • filter: progid:DXImageTransform.Microsoft.DropShadow – for Internet Explorer to 9 version,
  • text-shadow – for most browsers,
  • -webkit-text-shadow  - for Safari up to 5.1 version, Chrome up to 10.0 version, Android up to 4.0 version and iOS Safari up to 5.0 version,
  • -moz-text-shadow – for Firefox up to 4.0 version.

When you use shadows text, don't forget that, in some cases, this property will expand element's borders, result in scrollbar may appeared or page may shifted.
The properties text-shadow, -webkit-text-shadow  и -moz-text-shadow have next syntax:
Property: none | <shadow1> [,<shadow2>]*
where:

  • Property is one of next values - text-shadow, -webkit-text-shadow  или -moz-text-shadow.
  • none – without shadow
  • Shadow includes next elements:
    1. X-axis shift
    2. Y-axis shift
    3. blurring
    4. color

An example of application the CSS text-shadow online generator

An example of application the CSS text-shadow online generator
HOME
RESOURCES
ABOUT