Creating a transparent Panel in .NET
Today I wanted to create a transparent Panel-Control in .NET in order to superimpose it on the WebBrowser Control in order to record click events. The goal was to code a simple macro recorder for websites. Unfortunatelly the .NET framework does not allow (in an easy way) to make a control fully transparent. So it was back to the good ol' winuser.h and the extended window styles. Namely 0x00000020L or as it is better known WS_EX_TRANSPARENT.
I left it as bare as possible (because that's all I needed).
- using System;
- using System.Drawing;
- using System.Collections;
- using System.ComponentModel;
- using System.Windows.Forms;
- using System.Data;
- namespace WebBrowserAutomation
- {
- /// <summary>
- /// A transparent control.
- /// </summary>
- public class TransparentPanel : Panel
- {
- public TransparentPanel()
- {
- }
- protected override CreateParams CreateParams
- {
- get
- {
- CreateParams createParams = base.CreateParams;
- createParams.ExStyle |= 0x00000020; // WS_EX_TRANSPARENT
- return createParams;
- }
- }
- protected override void OnPaintBackground(PaintEventArgs e)
- {
- // Do not paint background.
- }
- }
- }
Now you can draw images or any other control on it. You can capture mouse click events through this transparent layer before they pass through to controls below ... actually the possibilties are quite endless. ![]()

Thanks, this really helped me out alot.
Just one question;
Is it possible to clear the graphics (some shapes that I have drawn onto it) of the panel and still keep it transparent?
Graphics g = myTransparentPanel.CreateGraphics();
Rectangle rect = new Rectangle(50, 50, 20, 20);
g.FillRectangle(new SolidBrush(Color.white), rect);
g.Clear(myTransparentPanel.BackColor);
g.Dispose();
The example above will clear the graphics, but also remove the transparency of the panel and set it to default-grey.
Comment on November 1, 2007 @ 09:36:13
Hey Tobias,
unfortunatelly myTransparentPanel.BackColor does NOT contain “transparent”. We mainly get “transparent” by not rendering the background. So my best guess would be to throw away the panel and create a new one. As far as I know there is no way to go back to “transparent” in Windows Forms. Sorry.
Cheers,
Tobi
Comment on November 5, 2007 @ 09:41:35
Yepp, that’s how I solved it.
Thanks anyway!
/T
Comment on November 5, 2007 @ 13:02:25
No problem, glad I could help you out with this post.
Comment on November 6, 2007 @ 13:57:42
Hello,
I have two clarifications:
1) I’m developing a stand alone application. I’m planning to create a background for the application instead of the plain monotonus grey color. Is it possible?
2) The tools should have semi-transparent feature when dragged within the application…how to do it?
Thanks in advance
Rony
Comment on January 11, 2008 @ 07:13:24
Hello,
I have two clarifications:
1) I’m developing a stand alone application in VB .Net. I’m planning to create a background for the application instead of the plain monotonus grey color. Is it possible?
2) The tools should have semi-transparent feature when dragged within the application…how to do it?
Thanks in advance
Rony
Comment on January 11, 2008 @ 07:13:58
i’m creating a component called LookingGlass, which extends Panel. i want to be able to see through a hole in the middle of it, but i don’t want to effect its Region because i may want to draw something semi transparent over the top.
at the moment, my program has it, and one other panel, inside a window. it is position so that it overlaps the corner of the other panel. the BackColor property is set to transparent, and its Border to FixedSingle. i can see though it perfectly over the window (which has a tiled BackGroundImage), but i can’t see the other panel through the part that it overlaps. i can only see the window (its parent) through it.
how can i create transparent/semi-transparent control that can overlap more than other control?
Comment on January 24, 2008 @ 17:35:24
Excellent article, I also found this one thats explain the way to invalidate the parent control to get all the inner control repainted.
http://www.bobpowell.net/transcontrols.htm
Cheers
Comment on January 31, 2008 @ 20:32:33
this.panel1.BackColor = System.Drawing.Color.Transparent;
Comment on February 1, 2008 @ 17:56:40
wuchang: actually, not the case.
Comment on February 4, 2008 @ 23:57:00
I have a Panel (panel1) that contains a TreeView control AND a transparent Panel (TransPanel).
The TransPanel completely overlaps the TreeView control.
How can I pass on mouse events from the TransPanel to the TreeView control so that it functions transparently? As TreeView is a sibling control – rather than the container – I’m having difficulty doing this.
Please Help!
Comment on February 13, 2008 @ 00:54:05
Excellent article, I also found this one thats explain the way to invalidate the parent control to get all the inner control repainted.
http://www.bobpowell.net/transcontrols.htm
Comment on April 3, 2008 @ 15:12:03
That’s great, but I couldn’t figure out how to have controls underneath, such as the WebBrowser control still receive the mouse events?
Comment on November 9, 2008 @ 11:41:01
I put this panel on a form. Did not draw anything on it. Hooked the click event and clicked and I cannot get the event? Must I have something in it?
Comment on November 17, 2008 @ 14:29:18
i already put a web browser on a panel in windows application.I want a click event on the browser.Plz help me .
Comment on November 21, 2008 @ 06:20:05
to get the events from the webBrowser just set the enabled property of your transparent panel to false.
Comment on April 28, 2009 @ 14:13:35
I needed to do the same exact thing, except over something other than a web browser. This was exactly what I was looking for, thanks!
Comment on October 19, 2009 @ 06:18:16
Thanks so much! I’m just learning and this has been frustrating me for almost an hour.
Comment on November 19, 2009 @ 05:27:58
Dude you rock.
Comment on January 22, 2010 @ 15:25:04
Dude you rock.
Comment on February 12, 2010 @ 15:16:41
I’m writing a small program that creates an isotopic view of what would be squares, since it’s isotopic, they appear to be diamond shaped. I’m having issues with one diamond showing all 4 of its neighbors. I thought about simply drawing onto a panel, but that complicates things like Tooltips for individual diamonds, context menu strips when I right click a diamond, and scrolling because this field of diamonds will be quite sizable. All in all, I need it to display controls it’s overlapping but I can’t get it to work when one control overlaps several other controls. I’ve hunted and tried many different techniques… any ideas?
Comment on March 21, 2010 @ 02:57:25
Super, das hat mir perfekt weiter geholfen.
Vielen Dank!
Comment on April 29, 2010 @ 00:52:02
to get the events from the webBrowser just set the enabled property of your transparent panel to false.
Comment on May 26, 2010 @ 14:21:53