Questions tagged [opacity]

Opacity is the degree to which a graphical object obscures objects which are rendered behind it.

Graphical objects which have a level of opacity less than 100% can be "seen through". The objects which are rendered behind are blended with the object in front; the resulting effect being like looking through a pane of coloured glass.

Opacity appears as an attribute in many graphical contexts, including [3D rendering], and Web Styling.

Opacity is the opposite of .

See also:

2509 questions
48
votes
3 answers

How set alpha/opacity value to color on xml drawable?

I need to set a value of opacity to a color in xml drawable. But when i try to add the two values of opacity (#20C0C0C0) for example, don't work. The color appeares totaly transparent. Here is my code...
Ricardo Graça
  • 581
  • 2
  • 9
  • 17
46
votes
5 answers

CSS - Opaque text on low opacity div?

I have a div with 60% opacity, to show part of a background image behind the div. Because the opacity is at 60%, the text in that div appears as grey. Is there anyway to override this level and make the text appear black? Any advice…
Dan
  • 4,068
  • 10
  • 41
  • 51
45
votes
2 answers

Is there any way to hover over one element and affect a different element?

I want it to be as simple as this, but I know it isn't: img { opacity: 0.4; filter: alpha(opacity=40); } img:hover { #thisElement { opacity: 0.3; filter: alpha(opacity=30); } opacity:1; filter:alpha(opacity=100); } So when you…
Marlon
  • 597
  • 2
  • 8
  • 17
45
votes
2 answers

Achieving white opacity effect in html/css

is there a way to achieve this effect in a cross-browser compatible way without having to prepare separated images? Basically the frame on which text lays has a white overlay of 50% opacity.. I would like a solution that doesn't involve creating any…
Jack
  • 131,802
  • 30
  • 241
  • 343
42
votes
2 answers

Text shadow opacity

Is it possible to adjust the opacity of just the text shadow, rather than the text itself as well? E.g I have purple text with a blue shadow. I'd like to make the blue shadow have an opacity without losing anything on the purple. h1.blue…
Francesca
  • 26,842
  • 28
  • 90
  • 153
41
votes
1 answer

Why can't child elements override the opacity of parent with a greater value?

As we know, child elements cannot as of now override the opacity property of its parent. The opacity property of the parent always takes effect. This makes sense when the child is trying to underride (override with smaller value) the opacity of the…
techfoobar
  • 65,616
  • 14
  • 114
  • 135
37
votes
4 answers

How to make a div's background color translucent?

I only want the background color of white in my div to be translucent roughly 50%. The content should be fully opaque. What's the proper way to do this? I imagined when I looked up the background CSS property, I'd find an opacity setting, but…
at.
  • 50,922
  • 104
  • 292
  • 461
36
votes
5 answers

how to handle 'double opacity' of two overlapping divs

I have two divs, both with 0.6 opacity. I need them to overlap but retain their opacity and not create a new combined opacity level. I can't use an image. EDIT -- The little circle is supposed to have a canvas element in it. Not sure if…
tripleZee
  • 458
  • 2
  • 5
  • 11
35
votes
6 answers

How to change a bitmap's opacity?

I have a bitmap: Bitmap bitmap = BitmapFactory.decodeFile("some/arbitrary/path/image.jpg"); But I'm not going to display the image to the user. I want the alpha to be 100 (out of 255). If this is not possible, can I set the opacity of the Bitmap?
Mohit Deshpande
  • 53,877
  • 76
  • 193
  • 251
35
votes
6 answers

Add circular fading opacity (vignette effect) to images in CSS

I want to give circular opacity to an image using CSS. I know I can achieve opacity on images like this: .circle img { opacity: 0.4; filter: alpha(opacity=40); } I know I can achieve circular images like this: .circle { border-radius:…
balintpekker
  • 1,804
  • 4
  • 28
  • 42
33
votes
3 answers

Can you create gradients that fade to opacity using CSS or JavaScript?

WebKit has introduced the ability to create CSS gradients. For example, with the following code: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#000)); However, is it possible to have an opacity gradient using CSS? I want the…
木川 炎星
  • 3,893
  • 13
  • 42
  • 51
33
votes
3 answers

How do you override the opacity of a parent control in WPF?

When you set the opacity on a Grid in WPF, all the child elements appear to inherit its Opacity. How can you have a child element not inherit the parent's opacity? For example, the following parent grid has one child grid in the middle with a…
Metro Smurf
  • 37,266
  • 20
  • 108
  • 140
32
votes
8 answers

JPEG image with transparency

I would like to make a JPEG image file with some pixels that are partially transparent or fully transparent, similar to a PNG file with an alpha channel. Is this possible? If so, how would I go about doing this? I would like to use the image on a…
Elias Zamaria
  • 96,623
  • 33
  • 114
  • 148
31
votes
3 answers

What is the difference between "opacity" and "filter: opacity()"

Most of us know the simple opacity CSS rule, but recently I stumbled upon filter which can have opacity(amount) as it value - among other things. But what exactly is the difference between the two?
Bram Vanroy
  • 27,032
  • 24
  • 137
  • 239
30
votes
5 answers

How to set opacity to the background color of a div?

I have this class .box { background-color:#fff; border:3px solid #eee; } My question is how can I set an opacity to the white background only so that it will kinda mix with my background? Thank you.
EnexoOnoma
  • 8,454
  • 18
  • 94
  • 179