www.PhotoshopTower.com
Return Home Tutorials About Us Services we offer Contact Us Affiliates Site Search
Hot Extras
Tutorial Spotlight:
Add some Tech Wires to your website layouts, and application interfaces. A must see! read more...
Join our Mailing List to receive:
  • Site Updates
  • Photoshop Tutorials
  • Webmaster Tips
  • Hot Site Reviews
  • & much more...

  • Mailing List: Privacy Policy


    Affiliates
    Your Link Here

    www.VidPit.com: Funny, Cool & Sexy videos!



    Pixel-EFX.net :: Where The Web & Mind Combine

    Kostenloses für den Webmaster





    Link to us
    ( Link to PhotoshopTower.com )



    wholesale computers

    PhotoshopForce.com - Photoshop Tutorials

    Site By: Coastal Web Innovations

    Some web hosting solutions you can find yourself on WHG and a list of
    web hosting companies.
    Trendy Bevel Buttons


    In this tutorial l will explain how to create those trendy bevel buttons that you see popping up all over the net these days, especially on phpBB, and VBB templates. The neat thing about these buttons is that they are extremely easy to create, and look very nice and clean. After completing this tutorial you too will be able to create these trendy bevel buttons and apply them to all sorts of applications, and designs.

    Page 1 of 1

    Step 1.)
    Open an existing document, or start a new one of any size. I'm using 500 x 300 with a simple grid background.



    Step 2.)
    Create a new layer and using the rectangular marquee tool make a selection as pictured bellow:


    and fill this selection with white (#FFFFFF)




    Step 3.)
    Double click this layer, and apply the following blending options:
    Gradient Overlay




    Because it's difficult to see at this point, l've added a "lime green" highlight around the result, here's how yours should look (less the green highlight of course):




    Step 4.)
    Create a new layer. Now set your foreground color to: #4A4A4A and get out the 'Pencil Tool'. Draw a 1 pixel line across the top of your box, and down the left side as pictured:




    Step 5.)
    Finally set your foreground color to: #131313 (dark dark grey) and again with the Pencil Tool, draw a 1 pixel line along the bottom of your box, and down the right side, as pictured:


    And that's all there is to it. All you need to do now is add text, and icons and you're finished. Here's what l ended up with after fooling around with it for a few minutes:




    Related Tutorials:
        View Render Layout Tutorial vol. 4: Button Creation Render Layout Tutorial vol. 4: Button Creation
    In this tutorial you will learn how to create an entire layout by using an exsis ...
        View CMS Buttons CMS Buttons
    Learn how to create simple CMS or (Content Management System) buttons, quickly a ...
        View Beveled Control Buttons Beveled Control Buttons
    Learn how to create 3d Control buttons that look like they're popping right off ...


    Home | Tutorials | About Us | Services | Contact Us | Affiliates | Search | SM | Top^