Gradientz - Your Gradient Magician

Modern design relies heavily on gradients to create eye-catching visuals, but most creators either rely on generic presets or waste time jumping between tools to find or generate gradients. I wanted to solve this by building something native to Adobe Express — fast, intuitive, and flexible — so users can design without disruption.

What it does?

Gradientz is an Adobe Express Add-on that makes working with gradients seamless. It offers:

12 beautiful, trendy preset gradients

Live gradient preview on canvas

Color pickers and angle sliders for custom creation

A “Surprise Me” button to generate random gradients

One-click add or drag-and-drop gradients directly into the design

It’s simple, powerful, and saves time for creators at every skill level.

How we built it?

The add-on is built using:

React and TypeScript for UI and component logic

HTML/CSS for layout and styling

Adobe Express Add-on SDK to handle interactions like inserting images

Spectrum Web Components to keep the UI clean and consistent with Express

The app runs smoothly in the Adobe Express Code Playground and is built with production-readiness in mind.

#AI #adobe #hackathon #devpost #react #design #webdevelopment #buildinpublic