One of the surfaces that people love to play with in the 2D and 3D world is chrome. Its sleek and high polished appearance never fails to grab people's attention. This How to Make Chrome in Photoshop page will walk you through the steps for creating a convincing chrome that can adorn anything from Web interfaces to advertisements.
Learn to Make Chrome
The instructor in this video shows you how to make chrome on text using several effects. He does a good job of showing you how to build up colors in the gradient editor to make a facsimile of a metal. Luckily, he even instructs you on the creation of your own contours in the layer style menu.The running time is 13:08.
Introduction
This tutorial will be a cinch for anyone that is comfortable with Photoshop's interface already. You should be able to complete it in 10 to 15 minutes. Because chrome's style depends heavily on the reflection of other objects across its mirror-like surface, you may want to have an image handy to use as a reflection map if you plan to have scenery in your final picture.
Step 1: Pick Your Text
In the example, 150 point text is used. Aim for a font that isn't extremely thin. Otherwise, you will have to adjust the numbers quite a lot.
- Create a new document by typing Ctrl+N.
- Set the width and height to 500 pixels and give the file a transparent background.
- Name the transparent layer textChrome.
- Push T to activate the text tool.
- Under the main menu, you will see the text bar. Change the text size to 150 points or a size of your choice.
- Type your text.
Step 2: Apply Layer Styles
Now, you will add dimension with layer styles.
- Click your layer named textChrome then push the layer style icon at the bottom of the layer window. It looks like a lowercase f in a circle. (Hit the F7 button if your layer window is closed.)
- Choose Bevel and Emboss. Now, there is a check mark next to the name.
- Use the images in the following steps to fill in the custom settings for Drop Shadow, Bevel and Emboss, Contour, Satin , Gradient Overlay and Stroke.
Drop Shadow Settings
Bevel and Emboss Settings
Contour Settings
Satin Settings
Gradient Overlay Settings
Gradient overlay will control the color and give the appearance of a simple reflection.After ticking the Gradient Overlay check box, click the colorful image next to the word gradient on the window. Now, you will see the area where you will make the actual color transitions. Pick the first color node and change the color to ffffff. Make the last node the same color. Refer to the graphic to see where you add the third and fourth nodes. To add a node, just click under the color bar on the gradient window. The third color is 9c9c9c, and the fourth is 5e5e5e. Hit ok once you are done.
Stroke Settings
Stroke with gradient fill will further the appearance of reflection around the edges.
Note: The node colors are black and white.
Step 3: Adding Reflection
At this final stage, we will create a generic image to act as the reflection.
- Use Shift + Ctrl + N to add a new layer. Name it reflection.
- Make your foreground and background colors white and black. Go to Filter -> Render -> Clouds.
- With the reflection layer active, use Filter -> Sketch -> Chrome. Make Detail a value of 4 and Smoothness a value of 7.
- Hit Ctrl + T to scale the layer's height down 50%. (You want to make the scale of your reflection image similar to what you are making chrome.)
- Click Ctrl + I to invert the picture.
- Now, Ctrl click textChrome. This will make a selection of that shape.
- Click the reflection layer so that it is active. Then, go to Select -> Modify -> Contract. Enter 2.
- Push the mask icon. (It's at the bottom of the layer interface and looks like a square with a circle in the middle.)
- Alt click the mask on reflection. You should see the mask visible in the window. Ctrl click it to make a selection.
- Hit delete then fill the shape with a gradient that goes from white at the top of the letters to black at the bottom.
- Change the layer blend mode of reflection to Color Burn. (Blend modes are located in the top left corner of the layer window.)
Final Image
Real Photograph Reflection Variation
In this graphic, you see an example of using a real photograph as the reflection image. The steps are the same except that you don't use a gradient in the reflection layer mask. (The reason for this is because this picture has a clearly defined top and bottom on its own.) Also, the opacity was lowered on this layer by 50%.
Old School Chrome
Back in the old days, you saw this strange version of chrome. Although it isn't realistic, the reason for the colors is based off of a blue sky and brown ground reflecting into chrome. Most people prefer the more realistic version these days. But, it you're feeling nostalgic, just change the Gradient Overlay gradient setting to Photoshop's preset called chrome.
Click to enlarge.
References
Fast Facts
-
Tip 1
When working with various shapes, especially wide ones, you will have to make adjustments to maintain the look. Keep in mind that you are trying to achieve a look that is highly reflective with sharp highlights. Try altering the bevel size first when tweaking.
-
Tip 2
If you need help with gradients, you can learn more about them in the How to Use the Gradient Tool in Photoshop page.
-
Tip 3
Maximize the crispness of your images by creating your documents twice as large as you need. Once you are done, shrink it down by 50% to get your final image.
-
Tip 4
If you don't like the combination made by Render Clouds, you can redo it by clicking Ctrl + F.
