Click here to Skip to main content
13,006,281 members (56,545 online)
Click here to Skip to main content
Add your own
alternative version


61 bookmarked
Posted 24 Aug 2005

Gradient Forms - The Easy Way

Rate this:
Please Sign up or sign in to vote.
This article shows you how to easily implement gradients as background in your form.


I have noticed that a lot of programmers don't bother about the looks of their software. Mostly because they think it is too hard or that it takes too much time. There are certain things that you can do in .NET which can make your application look better with minimal effort. One of those is having a gradient background on your form. Sometimes even a light gradient is enough to make your product stand out in the crowd.

I looked in CodeProject and saw that there was already an article on GradientForms by Erdal Halici. I found his approach rather complicated and lengthy for such an easy task. That's why I wrote this article. This article will show you how to do this in a very easy way, with a small base class that you can use in your application. I promise the only thing you will have to do is to set the colors. It isn't that hard, is it? :)

Laaaadieees and Gentlemeeen, start your Visual Studioooo's!

The good, the bad and the gradient

The good

There are people who take the time to look for the right color for their application. They look for a consistent background that will make their product stand out and recognizable. I applaud this, but why not take it one step further and choose two colors?

The bad

There are people who don't even bother to look for a color. The application just uses that boring gray background color that you see in many applications. You should be ashamed of yourself!

The gradient

And then there are people who apply gradients in their background. It doesn't take any extra effort except for choosing the colors, and your application has that extra visual touch and guess what: Users love these visual things.

Crafting the BaseGradientForm

First things first

The BaseGradientForm is nothing more than a normal form that has some predefined properties and methods. You create it the way you normally create a form. The only thing we do is add some properties and such.

We need three properties to pull it off:

  • Color1: First gradient color.
  • Color2: Second gradient color.
  • ColorAngle: The angle of the gradient.

These do nothing special. These are normal properties like any other property. There's only one difference: when we set a value (from code, or in the design window of our derived form) we need the form to repaint itself. To achieve this we need to call a method that tells our form (or control, when used on a control) to repaint itself. The method used for this purpose is Invalidate. We need the Form to repaint itself when any of these three properties are changed, and thus set. So, we add the line to set all three properties.

private Color _Color1 = Color.Gainsboro;
private Color _Color2 = Color.White;
private float _ColorAngle = 30f;

public Color Color1
  get { return _Color1; }
    _Color1 = value; 
    this.Invalidate(); // Tell the Form to repaint itself

public Color Color2
  get { return _Color2; }
    _Color2 = value; 
    this.Invalidate(); // Tell the Form to repaint itself

public float ColorAngle
  get { return _ColorAngle; }
    _ColorAngle = value; 
    this.Invalidate(); // Tell the Form to repaint itself

Painting our Picasso

Whenever the form gets a call to repaint, either from our Invalidate or from the operating system, it will fire two events: Paint and PaintBackground. It doesn't actually matter in which of the two you put your code, but here we will override PaintBackground to do our thing. In this method, we draw a rectangle onto the form. This rectangle will have the same dimensions as our form. This way it will cover the entire form and will act as the background.

protected override void OnPaintBackground(PaintEventArgs pevent)
  // Getting the graphics object
  Graphics g = pevent.Graphics;

  // Creating the rectangle for the gradient
  Rectangle rBackground = new Rectangle(0, 0, 
                            this.Width, this.Height);

  // Creating the lineargradient
  System.Drawing.Drawing2D.LinearGradientBrush bBackground 
      = new System.Drawing.Drawing2D.LinearGradientBrush(rBackground, 
                                        _Color1, _Color2, _ColorAngle);

  // Draw the gradient onto the form
  g.FillRectangle(bBackground, rBackground);

  // Disposing of the resources held by the brush


When you test the code that we have written you will notice that strange things happen when you start resizing your form. This is not because critters have taken over your system, it happens because the form doesn't get a 'Repaint Yourself Event' where it resizes. We really have to do everything ourselves, don't we? Luckily, we don't need to do the hard task of overriding the Resize event, but just add one line in the constructor of the BaseFormGradient that tells the form to repaint on resize.

this.SetStyle( ControlStyles.ResizeRedraw, true );

Using the code


You know that when you write an application, and thus create a form you always create a baseform? You do that, right? Just have that baseform inherit from the 'BaseFormGradient', after you add BaseFormGradient.cs to your project, and voila! You have the gradient capability on your form!

No BaseForm?

Don't worry (be happy?), you can still have the gradient capability even if you don't have a baseform. Just have your forms inherit from 'BaseFormGradient', after you add BaseFormGradient.cs to your project.

Applying the gradients

All you need to do is set both the colors and the angle for the gradient. Yes I'm serious, that's all there is to it!


This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


About the Author

Uytterhaegen Tommy (Tuy)
Web Developer
Belgium Belgium
No Biography provided

You may also be interested in...

Comments and Discussions

QuestionThank You Pin
Yakin7929-Apr-17 18:59
memberYakin7929-Apr-17 18:59 
QuestionLicense Pin
astrodog4619-Nov-12 6:42
memberastrodog4619-Nov-12 6:42 
QuestionEasyier Way Pin
Justin Spafford8-Jul-11 22:16
memberJustin Spafford8-Jul-11 22:16 
AnswerRe: Easyier Way Pin
Socarsky17-Dec-13 19:38
memberSocarsky17-Dec-13 19:38 
GeneralMy vote of 5 Pin
Mark Farr11-May-11 0:10
memberMark Farr11-May-11 0:10 
GeneralMy vote of 5 Pin
itsho26-Sep-10 8:22
memberitsho26-Sep-10 8:22 
Generaljust a small note Pin
itsho26-Sep-10 8:22
memberitsho26-Sep-10 8:22 
GeneralMy vote of 5 Pin
Dave Cross9-Aug-10 2:29
memberDave Cross9-Aug-10 2:29 
Generaldo you have an update of this for VS2005 Pin
DavidLanham19-Sep-07 3:27
memberDavidLanham19-Sep-07 3:27 
GeneralRe: do you have an update of this for VS2005 Pin
DavidLanham19-Sep-07 3:44
memberDavidLanham19-Sep-07 3:44 
QuestionBug - Transparent Title Pin
metroholographix5-Jul-07 23:46
membermetroholographix5-Jul-07 23:46 
AnswerRe: Bug - Transparent Title - solution Pin
metroholographix6-Jul-07 0:32
membermetroholographix6-Jul-07 0:32 
GeneralMDI Form Pin
DEGT18-Jun-07 3:48
memberDEGT18-Jun-07 3:48 
GeneralRe: MDI Form Pin
reaplo27-Apr-09 19:06
memberreaplo27-Apr-09 19:06 
NewsRe: MDI Form Pin
reaplo27-Apr-09 19:33
memberreaplo27-Apr-09 19:33 
Generalexcessive onPaintBackground Pin
c-a-b-20-Nov-06 10:19
memberc-a-b-20-Nov-06 10:19 
GeneralStyle Pin
Uytterhaegen Tommy (Tuy)25-Aug-05 20:29
memberUytterhaegen Tommy (Tuy)25-Aug-05 20:29 
GeneralRe: Style Pin
cbowl30-Aug-05 14:14
membercbowl30-Aug-05 14:14 
GeneralRe: Style Pin
Uytterhaegen Tommy (Tuy)30-Aug-05 21:08
memberUytterhaegen Tommy (Tuy)30-Aug-05 21:08 
GeneralRe: Style Pin
Miguel Lopes31-Aug-06 5:39
memberMiguel Lopes31-Aug-06 5:39 
GeneralRe: Style Pin
Anonymous31-Aug-05 23:53
sussAnonymous31-Aug-05 23:53 
GeneralSure it's easy to create gradients, but... Pin
rudy.net24-Aug-05 16:55
memberrudy.net24-Aug-05 16:55 
GeneralRe: Sure it's easy to create gradients, but... Pin
Uytterhaegen Tommy (Tuy)24-Aug-05 20:23
memberUytterhaegen Tommy (Tuy)24-Aug-05 20:23 
GeneralRe: Sure it's easy to create gradients, but... Pin
Miguel Lopes31-Aug-06 5:40
memberMiguel Lopes31-Aug-06 5:40 
GeneralRe: Sure it's easy to create gradients, but... Pin
PunCha25-Feb-07 22:09
memberPunCha25-Feb-07 22:09 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.170628.1 | Last Updated 24 Aug 2005
Article Copyright 2005 by Uytterhaegen Tommy (Tuy)
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid