CSS Button Generator

Helpful Tips

This button generator is easy to figure out just by playing around with the controls, but here are four helpful tips that may not be immediately apparent:

1. All the controls are universal except the colors.
2. If you use a double border style it needs to be a minimum of three pixels wide to have a gap between the two borders.
3. For a lighter shadow choose a shade of gray rather than black. Bonus Tip: Choosing a different color, like blue on a dark background, can give the button a glow effect.
4. The color picker tools have an eyedropper so you can choose any color on your screen. Very helpful if you're trying to match a color.
5. The Generated Code area is below the controls.