CSS Gradient Editor For Mac

CSS Gradient Editor is an intuitive developer tool for designing linear gradients and generating CSS code. It enables you to add up to 5 different color stops, configure vertical and horizontal gradients, copy the CSS source code and more.

The application is highly intuitive and includes 4 distinct areas in its main window. First of all, there is the Presets pane where you can create, load and rename presets and the Source pane that enables you to view the CSS code and copy it to the clipboard.

Secondly, users can use a Gradient pane for configuring the top and bottom colors on the X / Y axis, as well as a Webkit Preview area where the gradient can be viewed in realtime as you make changes.

Taking into consideration the nature of the workflow, the main benefit of using CSS Gradient Editor is that you can manually (and visually) manipulate the gradient and preview it in realtime while the CSS code changes as you modify the gradient.

The gradient can be adjusted on the X and Y axis and you can also choose the color format, such as RGB, RGBa, HSL or #FFFFFF. You can adjust and include 5 different color stops in the gradient and choose any top and bottom color.

In a nutshell, CSS Gradient Editor is a simple solution to editing CSS gradients that works as advertised. The interface displays all available options in a straightforward fashion and the CSS code is generated in realtime as you visually make changes to the gradient.