Super Simple CSS Color Gradient
CSS 3 offers lots of ways to define color gradients. If you're looking for a simple two-color gradient, this page will create the code for you. Make your choices and then copy/paste code from the Code box below.
Click your Pattern
Choose a Predefined Color Scheme...
...or enter your own color hex codes and click Go
| Color 1 Hex: | Color 2 Hex: |
* Adoble Color CCC is a good resource to find colors that don't clash. If you need a more complex gradient with multiple colors and stops, see the links below.
- uiGradients - Beautiful gradients
- 30 Beautiful Gradients
- ColorZilla CSS Gradient Generator
- CSSmatic Gradient Generator
- Angry Tools Gradient Generator
- {CSS} Portal Gradient Generator
- Only Gradient Generator You'll Need
- W3 Schools Gradients
- W3C Technical Docs
- Mozilla Development Network