Home / PS Tutorials

PS Tutorials · Tutorial

Design Beautifully Frosty Text Effect

PublishedJanuary 18, 2010
Reading time4 min
Filed underPS Tutorials
Design Beautifully Frosty Text Effect - PS Tutorials Lorelei Web Design Design Beautifully Frosty Text Effect — January 18, 2010

Today we are going to make a tutorial on frosty text effect. While it’s still cold and wintry outside, I thought it would be high time to supply some more wintry text effects for our readers.

Design Beautifully Frosty Text Effect - PS Tutorials Lorelei Web Design

So, begin with making  a new canvas of any desired size, and for now please use plain white (#ffffff) background. Later on we will add a custom texture or picture to the background, but for now, it will be much easier for your to work and see all the effects against the white canvas.

Design Beautifully Frosty Text Effect - PS Tutorials Lorelei Web Design

Select the typing tool and using Arial Rounded MT Bold font, set to “sharp”, use very big letters, say over 100. For the purpose of the tutorial we used 115, however if you choose to download out PSD, you will see that our original canvas consists from letters with font size 195.

Type your word.

Design Beautifully Frosty Text Effect - PS Tutorials Lorelei Web Design

The main part of this Photoshop tutorial consists from precise application of the layer styles as we are going to work with custom designed curved, textures (default) and a lot of other features. Let’s begin and please try to follow us throughout the tutorial if you wish to achieve the same result.

Go to Layer >> Layer Styles, and start off with “Drop Shadow” options. Apply the settings as you see below. For the shadow here we used a very dark blue, almost black color: #003059. However, feel free to chose a different hue if you are going to work with a light background canvas afterward.

Design Beautifully Frosty Text Effect - PS Tutorials Lorelei Web Design

Switch the tab to Inner Shadow. For Inner shadow we used a gray-blue color #0a7eaf, which will nicely complement the overall wintry feel of this text. Please pay attention to the fact that we are using “Noise” here at 3%, to add to the grainy / snowy effect.

Design Beautifully Frosty Text Effect - PS Tutorials Lorelei Web Design

Switch to Outer Glow and apply a very dark outer glow effect, we used #0a1732 with 35% which gave us light yet dark outlined shade.

Design Beautifully Frosty Text Effect - PS Tutorials Lorelei Web Design

Working our way down (in Photoshop..), to Inner Glow settings. This one gives our text effect the feeling of light and reflection, yet this is not going to be a direct spotlight, rather a cold reflection as you are used to seeing when looking on ice. Also here please note that we have applied a 17%, very visible noise.

Design Beautifully Frosty Text Effect - PS Tutorials Lorelei Web Design

Add Bevel and Emboss settings for extremely curved effect.

Written by

Elizabeth Lorelei Sramek

AI results optimization architect and SEO expert with 20+ years of experience. Crafting strategies that outrank, outperform, and outlast.

28 responses

  1. fojty January 20, 2010
    Reply
    1. Lorelei January 21, 2010

      looks awesome!

      Reply
  2. Abdulaziz Lamlum January 20, 2010

    Amazing how you thing of the options that you might use

    Reply
    1. Lorelei January 21, 2010

      Thanks, glad you like it!

      Reply
  3. Cindy Ko January 26, 2010

    I don’t know how to insert color. Because my text still grey… I want to be blue text!

    Reply
    1. Lorelei January 26, 2010

      try setting the gradients to shades of blue or alternatively use color overlay options with the blue shade of your choice. 🙂

      Reply
  4. Cindy Ko January 28, 2010

    I done during 1 weak!!
    I am proud of my self!!
    Thank you for your teaching!

    Reply
  5. Cindy Ko January 28, 2010

    But not same as you…

    Reply
  6. ??????? ?????? ????????? ?????? at Make It January 31, 2010

    […] ??????? ?????? ????????? ?????? ?? ?????? ????? Lorelei. ?????? ????? ???????? ????? ???????? ? ???????? […]

    Reply
  7. Cindy Ko February 5, 2010

    How can you update some steps in tutorial?(like layers…)

    Reply
  8. christian February 6, 2010

    i cant paste an image behind the text… how do i do that?

    Reply
  9. Mia Holmen February 11, 2010

    Where do I get the Weave 5 pattern?

    Reply
  10. Jay March 2, 2010

    Wow, this is really cool!

    Reply
  11. Morten March 6, 2010

    Awesome tutorial! Thank you!

    Reply
  12. smith March 29, 2010

    great tuts..you are good artist..I am working as a web designer at http://www.websitedevelopment-india.com and it helped me to improve my design work..thanks

    Reply
  13. The Ultimate Roundup of Best Photoshop Text effects Tutorials – Programming Blog May 9, 2010

    […] 10.Design beautifully frosty text effect […]

    Reply
  14. The Ultimate Roundup of Best Photoshop Text effects Tutorials | DesignerLinks | Home to Web design news, jQuery Tutorials, CSS tutorials, Web Designing tutorials, JavaScript tutorials and more! May 10, 2010

    […] 10.Design beautifully frosty text effect […]

    Reply
  15. The Ultimate Roundup of Best Photoshop Text effects Tutorials – Design Today May 10, 2010

    […] 10.Design beautifully frosty text effect […]

    Reply
  16. ?????????????Photoshop???????60???? 2010?5?? | DesigNet May 10, 2010

    […] ?????????????????????????? […]

    Reply
  17. The Ultimate Roundup of Best Photoshop Text effects Tutorials | Feed-Syndicate May 14, 2010

    […] 10.Design beautifully frosty text effect […]

    Reply
  18. Photoshop Text effects Tutorials and Samples Collections | Design | Web Risorsa | A Web Resource Abode May 19, 2010

    […] 10.Design beautifully frosty text effect […]

    Reply
  19. The Ultimate Roundup of Best Photoshop Text effects Tutorials | My Free Design Area – A Webpage for Joomla Free & Commercial Templates, Wordpress Free & Commerciak Themes, and Drupla Free and Commercial templates, Flash Templates and animation, Ht June 2, 2010

    […] 10.Design beautifully frosty text effect […]

    Reply
  20. 80 Photoshop Tutorials für Text Effekte » FRISCH INSPIRIERT October 5, 2011

    […] 16. Frosty Text Effect […]

    Reply
  21. Photoshop – The love story | Design Schemers January 7, 2012
    Reply
  22. Frosty Ice Photoshop Tutorial September 22, 2012

    […] Free Photoshop Tutorial […]

    Reply
  23. 100 logo logo design photoshop tutorial Web Page Design | Web Page Design Templates | Html5 Template February 15, 2013

    […] 30. Lorelle – Frosty Logo Photoshop […]

    Reply
  24. The Ultimate Roundup of Best Photoshop Text effects Tutorials June 27, 2014

    […] 10.Design beautifully frosty text effect […]

    Reply
  25. fnaf August 3, 2018

    Really a helpful post forever. I believe that it will help with my next project

    Reply

Leave a response