HTML Gradient Tool

Add gradients to your designs to create color shifts and layered effects.

Start with presets or gradients you see on a website.

The 1der1 website editor understands HTML and styles. Then, you can use tools to design your creations.

Watch the video to see the gradient tool in action:

• Copy a website.
• Paste into a 1der1 editor.
• Click on an element to edit.
• The element has 19 backgrounds.
• Open the Gradient tool.
• Play with some settings.
• Add credits for the source.
• Open Josh Comeau's Gradient Generator.
• It creates better gradients by inserting intermediate colors.
• Copy the generated CSS.
• Paste it into the gradient field.
• The tooltip shows ten colors.
• Open the Gradient tool.
• Edit the gradient angle.
• Remove all intermediate colors.
• The gradient shows a "Gray Dead Zone."
• Select a color space.
• You can have a beautiful gradient.
• Without providing intermediate colors.
• Choose a sample gradient.
• Edit the color opacities.
• Change the background color.
• Preview while on the menu.
• Drag the Background gradient.
• Drop into the Border gradient.
• Remove the Background gradient.
• Change the border width.

Enjoy learning by doing with 1der1 :-)

Disqus - Express Yourself