Design Watercolor Effect Menu. This is a two-part tutorial on how to create an artistic and un-typical CSS list menu as seen on Web Designer Wall. In the first part (this article), I will show you how to design a watercolor effect menu in Photoshop. Then in next tutorial, I will show you how to slice the menu and code in CSS. If you need some inspiration on creating an artistic menu, visit our previous post on artistic websites. Ready? Download Photoshop file Preview Here is a preview of the final image: 1. First you need to find a notepaper stock image. Cutout the notepaper and apply 2px drop shadow effect. 2. Cmd + click on the notepaper layer to load the selection. Create a new layer. Repeat this step until you get multi layers of watercolor effects. 3. Find some coffee stain images, paste it in and set the layer blending mode to Multiply. Dirty and splatter effect: download and use the splatter or watercolor Photoshop brushes from Bittbox. Add some pencil sketch illustrations. 4. 5. 6. 7.
Here is my final image. Creating A Cool 3D Web Design Effect. In this tutorial I will show you some very easy techniques, using gradients and layer styles, that we can use to produce nice subtle 3D effects in our web designs. Step 1 Create a new document with 1000x750px. Double click on the background's layer and in Color Overlay and choose a dark brown. Step 2 Enable the rulers (View>Rulers) on your document and add some guides as shown below. Step 3 Create a rectangle with the Rectangle Tool (U).
Step 4 Choose black for your foreground color. After that, convert it to Smart Filters, apply a Gaussian Blur and change the opacity to 60%. Step 5 With the header layer selected, double click it to open the Layer Style dialog box. Step 6 Next, select the Line Tool (U) and choose the lighter color of the header gradient and create a line. Go to Layer>Layer Mask>Reveal All. Step 7 Create the menu using the Horizontal Type Tool (T). Duplicate the group and place it below the white links, change the text color to black and move the group 1 pixel up and left. Step 8. Clean White Navigation Bar | Layouts. Clean White Navigation BarReviewed by James Hewett on Mar 24Rating: Preview of Final Results Clean White Navigation Bar Photoshop Tutorial Step 1 To start off with, create a new document, for the purpose of this tutorial I have chosen 500 by 200 pixels.
Fill the background with a radial gradient from a medium-dark grey to a darker grey. Step 2 Create a new layer (Layer > New > Layer) and select the rectangular marquee tool. Step 3 Fill the selection with a linear gradient from #f4f4f4 at the top to #d9d9d9 at the bottom. Step 4 We are now going to be applying a couple of layer styles to this layer. Layer > Layer Styles > Outer Glow Result: Shut Down Icon - Photoshop drawing tutorial - page 1 of 7. Awesome, War-Style Game Buttons. In this quick Photoshop tutorial we’ll be learning how to design a set of really cool, war-style game navigation buttons First off start by making a new document and filling the background with a very dark color.
For this tutorial I used a document size of 400 x 400 pixels, and a background color of #0e0b06. Make a new layer and then get the Rectangular Marquee Tool, set the mode to Fixed Size, use the dimensions 100 px by 1 px On the new layer make the selection and fill it with a light yellowish orange color. (#e39206) Duplicate the line layerand move it down around 15-20 pixels downwards. Apply Filter > Blur > Motion Blur with a ratio of 100 to get this look: Apply these layer styles to the lines layer: (download the pattern from here) Make a new layer and leave it empty, select the two layers (new layer and the lines layer) and merge them together. Again, make a new layer and with the selection tool make a selection in between the two orange lines.
Fill the selection with #115272. Create a Nice Stylish Glossy Button in Photoshop « Core GFX. Long time no hear, eh? Well I’m sorry for not posting for so long but I was really busy with some other work I had so I will try to pay off once again. Today I have writen a tutorial about how to create a very nice stylish glossy button in Photoshop. I have decided to go for one color but later when you create this tutorial you can repeat it in any color you like or need.
There are a lot of ways to do some things but this is the way I’m doing it. This tutorial is going to show all the details so even noobs should be able to understand it. But if you have a problem, or a suggestion or any kind of question, feel free to contact me on my e-mail admin@coregfx.org . Let’s cut the talking and get down to business. Nice? Now let’s create a shape. ). If you have put those properties you can continue making a shape. Now we are going to fill it with some gradient. As you can see on the image above the two used colors are #3a4056 and #303548. Now let’s add a Drop Shadow to that layer. ) and Burn (