Smashing Magazine ~ we smash you with the information that will make your life easier. really.
Smashing Magazine we smash you with the information that will make your life easier. really.

Adobe Photoshop Tutorials - Rainbows, Glows and Light Effects

Advertisement

by Sean Hodge

Lighting effects in Adobe Photoshop are used to add flare and polish to images. They communicate feelings of creativity, technology, magic, and fantasy. Creating beams, glows, motion trails, rainbows, or an assortment of other lighting effects, give your images ambiance and depth.

Now it’s time for a sparkling dose of related Photoshop learning material. This article provides a resource of Adobe Photoshop Light Effects tutorials. These tutorials offer an assortment of techniques for making your work creatively glow.

Please consider them as an extension of our ultimate Adobe Photoshop series:

Photoshop Light Effects Tutorials

  • Lines Tutorial
    A super simple tutorial that makes rainbow colored lines. It shows you how to give them an appearance of brightness and depth.

    Lines Tutorial

  • Expressive lighting effects
    This tutorial combines both vector and raster based techniques to achieve a glowing floral design. The glows are applied in Photoshop.

    Expressive lighting effects

  • Vector Polishing Techniques
    This tutorial covers numerous ways to transform your vector illustrations into masterpieces by using Photoshop lighting techniques, glows, and filters.

    Vector Polishing Techniques

  • How to Make the “Flare” Effect As Seen On WPCustomization.com
    In this tutorial, the Lens Flare filter is used on the background. Then the lighting is created with brushes and different blending modes.

    How to Make the Flare Effect As Seen On WPCustomization.com

  • Sparkling Hot Girl in Photoshop
    Utilize an assortment of techniques to achieve a sparkling design. Masks, blurs, brushes, layers styles and other effects are used in this tutorial.

    Sparkling Hot Girl in Photoshop

  • Amazing Photoshop light effect in 10 Steps
    “If you know a bit of Layer Styles and the Brush engine in Photoshop you will be able to create amazing effects. It will depend exclusively on your imagination and playing with the tool. Sometimes just changing some settings and you get a totally different effect.” This tutorial applies lighting effects to a coffee cup icon.

    Amazing Photoshop light effect

  • Creating A Fantastic Fantasy Night Sky In Photoshop
    Create cartoon style clouds with rainbows, stars, and glowing effects. Based on a Nik Ainley design.

    Creating A Fantastic Fantasy Night Sky In Photoshop

  • Neon lights with Photoshop
    Tutorial on how to make glowing lights effects out of vector shapes and brushes.

    Neon lights with Photoshop

  • Electrifying Energy Beams
    In this tutorial you start with the pen tool by drawing a line. Then you transform that line into an energy beam with layer effects. This makes it glow white and purple around a microphone.

    Electrifying Energy Beams

  • Add Another Dimension
    Use glows and blending modes to “add another dimension” to your Photoshop artwork

    Add Another Dimension

  • Magic lighting effect in Photoshop
    Learn to magically make text wave and glow out of a magician’s hat.

    Magic lighting effect

  • Extreme sports branding
    This tutorial first covers creating a logo then it gets into the main snowboard illustration. Vector shapes are applied with layer effects and brushes to make the illustration stand out. This is part one in a series.

    Extreme sports branding

  • How to Create Intense Light Streaks in Photoshop
    This tutorial shows you how to create light streaks that appear to flow around an object.

    How to Create Intense Light Streaks in Photoshop

  • Chroma Wallpapers
    This tutorial explains how to create an energetic design with lines. Utilize blurs, warps, and other effects. Add glowing and vibrating colors to give this image a dynamic feeling.

    Chroma Wallpapers

  • Advanced Glow Effects
    This tutorial teaches how to create glow effects using layer styles, the pen tool, and some color blending effects.

    Advanced Glow Effects

  • Lighting Effects - Beam Wave
    Learn to transform a one pixel lines into a glowing beam. Then add radial balls of light to emulate a pulse explosion.

    Lighting Effects - Beam Wave

  • Add A Sparkle Trail To A Photo
    Learn how to add a sparkling trail of stars to your photos using brushes, layer styles, and effects.

    Add A Sparkle Trail To A Photo

  • Creating light motion trails & glowing sparks
    This tutorial covers creating light motion trails by using the pen tool with layer styles. It also covers creating sparkling stars in Illustrator and then importing them into the Photoshop design.

    Creating light motion trails & glowing sparks

  • Blue Glow Layout
    This tutorial reviews the process for creating a simple layout in Photoshop, while revealing techniques for creating an abstract glowing centerpiece design.

    Blue Glow Layout

  • Fantasy Art Photoshop tutorial
    Learn to create a fantasy image with glowing halos of lights and stars. Notice how you can apply glow directly to a cropped image. The tutorial creates the halos with the Elliptical Marquee tool. It applies a stroke and then a glow to the selection, on its own layer.

    Fantasy Art Photoshop tutorial

  • Photoshop: Light Beam
    This tutorial reviews the basic process of creating a light beam in Photoshop; however, it does refer to other tutorials for some effects. The techniques in this tutorial involve using different brushes to paint the light, and then they are smeared with the Smudge Tool. There are a few filters used as well.

    Photoshop: Light Beam

  • Even fairies have to rest - glow and lightning tutorial
    First, the photograph is treated to make it a little darker so that the points of light in the design will stand out. Both a linear wrapping beam and points of radiating light are covered in this tutorial.

    Even fairies have to rest - glow and lightning tutorial

  • Beautiful lighting FX effect in Photoshop
    This tutorial will show you how to make a beautiful lighting effect with the scatter brush. This tutorial covers the basics.

    Beautiful lighting FX effect in Photoshop

  • High-Tech Swirling Aurora
    This tutorial covers how to apply the Wind Filter to a waving light beam to create an aurora effect.

    High-Tech Swirling Aurora

  • Slow shutter text effect - Photoshop
    Layers of blurred elements are used in this tutorial. This blurring technique is worked into glowing linear text and circle shapes.

    Slow shutter text effect - Photoshop

  • Seriously Cool Photoshop Explosion Effect
    Use layer masks and light effects to creatively break apart an image. Points of bright lights, swirly brushes, and warped lines help bring this design together.

    Seriously Cool Photoshop Explosion Effect

Which techniques can be applied?

At the compositional level, these effects are often applied through shapes. So, you might start with the pen tool by drawing a curvy line. Or, grab a brush and draw some scattered stars. Or, open up Illustrator first to compose design elements that you then pull back into Photoshop. The tutorial Expressive lighting effects demonstrates how to use interesting design shapes first and then apply glowing effects to them.

Once you know how you’d like to use shapes, you can apply effects to them. Layer styles and Blending Modes are common effects used to create this look. With Layer Styles, you might apply Glow. Or, with Blending Modes, you might set the layer to Lighten, Overlay, or Color Dodge – get the element you’re working with to sparkle and shine.

Chroma Wallpapers
In the tutorial Chroma Wallpapers, lines are bent with the Warp Transform tool before being given a glow treatment.

There are more techniques often used; such as different types of blurs and gradients. You could play with Photoshop’s built in lighting effects, like Lens Flare, as well. Or get creative. Mix in rainbows. Paint glowing bursts of light. Manipulate the lines and shapes your working with.

In the tutorial Chroma Wallpapers lines are bent with the Warp Transform tool before being given a glow treatment. This puts a new spin on the use of glowing light techniques.

Where can I get some inspiration?

Consider raising it to the next level, after you’ve mastered the basics of lighting and glow techniques. To raise the quality of your glowing work you’ll need inspiration and imagination.

Look at artists, such as Chuck Anderson, that have mastered these techniques. Try to figure out what they have done – beyond the basics.

Chuck Anderson
Chuck Anderson’s work impresses with the beauty of its lightning effects.

Also, look at photographic effects; for example, look at how light appears to blur and travel in long exposure photography. See the Flickr Group Light Stream for samples of this kind of photography.

Keep your eyes and mind open. You’ll start to see these effects in the real world. Or look to fantasy art; the sparkling feel of these effects can be used to supersede reality, magically transforming your designs.

Sean Hodge is the creative mind behind AiBURN.com, a Weblog about design, creativity, inspiration and graphics.

Advertisement
  1. 1.

    JoomlaNinja (April 3rd, 2008, 6:11 am)

    Smashing mag strikes again!

    Love this one :)

  2. 2.

    giackop (April 3rd, 2008, 6:19 am)

    uooooooooooo my tutorial in smashing mag?!?!?!? thanx!!!!!!

  3. 3.

    Mike (April 3rd, 2008, 6:38 am)

    the best photoshop tutorial collection i’ve seen.

    thanks SM! *thumbs up*

  4. 4.

    YUI (April 3rd, 2008, 6:44 am)

    another bunch of photoshop tutorials, thanks

  5. 5.

    David (April 3rd, 2008, 6:54 am)

    Once again, an absolutely amazing collection!

  6. 6.

    Altair (April 3rd, 2008, 6:56 am)

    Great article… i love light effect…

  7. 7.

    Arriane (April 3rd, 2008, 7:24 am)

    This is superb! Thanks for the collection of tutorials!

  8. 8.

    Aria (April 3rd, 2008, 7:34 am)

    Wow! Great! thx so much!!

  9. 9.

    Gautch (April 3rd, 2008, 8:07 am)

    So are lighting effects and glows the new bevel or drop shadow?
    At what point is it an old out dated style?

  10. 10.

    anwar (April 3rd, 2008, 8:23 am)

    that,s amazing whit photoshop!!

  11. 11.

    Haobam (April 3rd, 2008, 8:47 am)

    PSDTuts.com is one cool Photoshop tutorial site - Link [www.haobam.com]

  12. 12.

    Vlad Gerasimov (April 3rd, 2008, 8:55 am)

    Hey! I’ve read Psdtuts tutorial and I thought I could try to make it better! So I wrote my own Rainbows tutorial, please check it out:

    Link [www.vladstudio.com]

  13. 13.

    ali (April 3rd, 2008, 9:14 am)

    pretty much all of them were from psdtuts

  14. 14.

    Shobhit (April 3rd, 2008, 9:15 am)

    Stunning TUTORIALS!!!!!
    Great to see them all in ONE…

    Smashing u guys are the best

  15. 15.

    fabio Sasso (April 3rd, 2008, 10:02 am)

    Thanks a lot for listing some of the tuts I wrote ;)…

    abduzeedo.com

  16. 16.

    David (April 3rd, 2008, 2:45 pm)

    Sweet, now this is what I want to see more of!
    Light makes such beautiful motion within pictures!

    I’ll be back for sure now ;)
    - Link [xeoncross.com]

  17. 17.

    The Fachia (April 3rd, 2008, 3:28 pm)

    I like the flare effect for Wordpress logo. I’ll try using that tutorial to make a flare Link [www.thefachia.com]. Just wait..

  18. 18.

    flko (April 3rd, 2008, 4:20 pm)

    GREAT TUTTOS, i like all

    Link [www.quintohache.com]

  19. 19.

    imsraaia (April 3rd, 2008, 4:51 pm)

    Excellent collection…

  20. 20.

    Anonymous (April 3rd, 2008, 5:58 pm)

    I wish you wouldn’t publish pictures degrading women. It is especially offensive for your female readers.

  21. 21.

    Chris (April 3rd, 2008, 6:16 pm)

    @”Anonymous”

    I’m not seeing any degrading pictures here, but then again, that’s a bit subjective. Care to clue me in?

  22. 22.

    Kim (April 3rd, 2008, 7:26 pm)

    @”Anonymous”

    I’m not remotely offended by anything in the article but like Chris said, something that is offensive to one may not be to another. Sadly, the only think that offends me on this page is your comment…

  23. 23.

    Oscar (April 3rd, 2008, 7:49 pm)

    Espectaculares!!!.

    Link [www.dimarkin.com]

  24. 24.

    christopher jack (April 3rd, 2008, 9:50 pm)

    wow, coool. that is what i want to study : )
    thanks.

  25. 25.

    Rohil (April 3rd, 2008, 10:16 pm)

    I am sorry but this is getting very repetitive. We have seen most of the tutorials before. Anyone who reads Smashing magazine surely reads PSDtuts and other good graphic sites as well. and thus. These tutorials have already been publicised enough.

  26. 26.

    Paulo (April 3rd, 2008, 10:19 pm)

    Great tutorials guys, as always!

  27. 27.

    Frank Felix (April 3rd, 2008, 10:55 pm)

    Die beste und schönste PS Tutorial-Sammlung, die ich je gesehen habe! Danke!
    The best and nicest PS tutorial-collection i’ve ever seen! Thanks! :P

  28. 28.

    Psycho2481 (April 3rd, 2008, 11:50 pm)

    damn, you did it again xD

    best collection, awesome things,…

    SM rockz

  29. 29.

    gr8pixel (April 3rd, 2008, 11:56 pm)

    hold on.. hold on… is this for real?? wait imma scroll back and see… LOL
    awesome tutorials! thanks guys!

    cheers SM \m/

  30. 30.

    One Winged Angel (April 4th, 2008, 1:28 am)

    I really love this tutorials collection. They sure help me a lot. Thanks SmashMag!

  31. 31.

    Jason (April 4th, 2008, 5:19 am)

    Although these are great tutorials… this style has seen its day. Its over used these days.

  32. 32.

    Beppone (April 4th, 2008, 6:14 am)

    Veeery nice… thanks….. :)

  33. 33.

    designlabel (April 4th, 2008, 6:22 am)

    Thanks for this list though i knew most of em’ already but its good to have a list. :-)
    DesignLabel

  34. 34.

    Skeku (April 4th, 2008, 6:54 am)

    Sorry, but I find this post very repetitive. Ok, nice effects but in most cases, same things about glows and lighting effects.

  35. 35.

    VTFootballGrad (April 4th, 2008, 7:23 am)

    This is why Photoshop rocks.

  36. 36.

    kidslovemusic (April 4th, 2008, 8:20 am)

    Absolutely great. Thank you!

  37. 37.

    bobo (April 4th, 2008, 4:45 pm)

    starting to double up from other ps posts. maybe less is more in this case so you can post more later

  38. 38.

    Ex (April 4th, 2008, 7:10 pm)

    Nice tutorials guys, as always!

  39. 39.

    Mikkel (April 4th, 2008, 11:47 pm)

    I absolutely agree, its like its so over used..

  40. 40.

    Jason Reed (April 5th, 2008, 5:56 am)

    Wonderful resource list. I can’t wait to try some of the new ones that I haven’t seen before.

  41. 41.

    Reginald (April 5th, 2008, 9:42 am)

    This post is literally jam packed with exceptional hard to find yet practical and useful information.

    Thanks for investing the time and effort this post may have required.

  42. 42.

    Lorelei (April 6th, 2008, 2:33 am)

    Hi,

    Thank you so much for adding my tutorial (fantasy art, by loreleiweb.com) to your list, it’s a great honour for me!

  43. 43.

    alex (April 6th, 2008, 9:32 am)

    the greatest ever..thank you very much for your precious information.

  44. 44.

    pocketfullofroses (April 6th, 2008, 1:08 pm)

    wow that’s stunning… thanks a lot for all these awesome tutorials!!!

  45. 45.

    Avasilcai Daniel (April 6th, 2008, 3:47 pm)

    For every lightning effect you’ll need a dark background, that’s the first rule,
    as you see in your examples are almost all with a dark background.

  46. 46.

    John Nelson (April 8th, 2008, 1:52 am)

    Wow, pretty usefull.

  47. 47.

    mellowdesign (April 8th, 2008, 12:05 pm)

    Lighting is one of my favourite areas of Photoshop - a great post!

  48. 48.

    iuliux (April 13th, 2008, 1:49 am)

    hey, what took you so long? :)
    I’ve been searching for this effect for some time

  49. 49.

    bojja (April 14th, 2008, 11:08 pm)

    Best stuff, excellent !!!
    Thank You :-)

  50. 50.

    JB Burayag (April 27th, 2008, 8:54 pm)

    its awesome!!! very addictive….

  51. 51.

    Prashant (April 29th, 2008, 12:12 pm)

    Awesome tuts. Lovely works and great learning for newbies like me.

  52. 52.

    VIDA (April 29th, 2008, 10:19 pm)

    U are the best ..it really helped me a lot..thanks !

  53. 53.

    Boris (April 30th, 2008, 10:15 pm)

    Really useful. Thank you…this will be on my Internet Stumbler for sure… Link [www.internetstumbler.blogspot.com]

  54. 54.

    rodrigo (May 6th, 2008, 3:13 pm)

    Hola podrian colocar esta misma pagina pero en español
    para ver los controles

    espero respuestas

    gracias

  55. 55.

    Web Design (May 15th, 2008, 9:41 pm)

    Great Tutorials!

Leave a Reply

Allowed Tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>
 

All Posts

Sideblog

Design inspiration: an overview of impressive data visualization and infographics. Keep in mind: data vizualization is about informative, not beautiful images.

Data Visualization and Infographics

Footers can be a place where a designer can let his creative juices flow a little more freely. Christian Watson shows 76 excellent footer designs. More footers.

Footers

Ross Johnson discusses 8 forgotten fonts you may use in CSS. Among them are Palatino Linotype, Century Gothic, Copperplate and Gill Sans — apparently, these fonts are installed on a variety of operating systems.

Palatino

How creative can a table of contents be? Designobserver presents Thirty Tables of Contents. The collection includes excerpts from the books by Philip Larkin, Philip Roth, Paul Rand and Jan Tschichold.

Table of Contents

A set of 18 splendid and colorful looking 3D RSS-Icons. They are done with 3d Studio Max. JPG.

Screenshot

In Font Clock 12 different fonts are printed within the mechanism of a clock, providing a random, mixed display of graphic language within a single time piece. Designed by Sebastian Wrong.

Font Clock

One pixel notched corners as used by Google Analytics. Instead of each option being boxed in a clickable rectangle, there is a 1px notch in each corner. It's not necessarily a curved corner, but it is a little softer than a normal box. Nice little trick.

Screenshot

Hartija is a CSS print framework which is an attempt to unite best CSS printing practices into one single CSS-file.

  • Grab the High-Quality OpenType Free Font Anivers!
  • Grab the Dilectio WordPress Theme!
  • Grab the Smashing WordPress Theme!