Step seven:
  • Create a new layer-set called "Navigation". Draw a #FFFFFF / height of 23 piece on top left corner of the header.
  • Add a Gradient overlay layer style.
  • Add your first navigation text, in this tutorial I'm using Arial, Italic, 11 pt, strong and #00415A.
    Gradient Overlay
    Gradient Blend Mode: Normal
    Opacity: 3
    Gradient: Default
    Reverse: Uncheck
    Style: Linear
    Align with Layer: Check
    Angle: 90
    Scale: 18



    Step eight:
  • Make the rest of your navigation by duplicating the first navigation elements. Have a 2 px space after each navigation piece.
  • In a new layer, use the pencil tool to draw the piece next to the navigation. This will be the roll-over effect.
    Roll-over effect:
  • For each navigation piece, extend the green bar to the middle of the piece.