Get the color after opacity but dont make the component transparent - css

I am working on a project and I want it to get the transparent color but getting the color from the backend and make it rbga code and then setting the alpha parameter to 0.3. But making this the div I am making is being transparent. Is there a way to get that color without making the div transparent. For exemple from the backend I get the color: #A79B8E But I want the background to be: #DCD7D2. Which is #A79B8E but with the opacity of 0.4. When I do it the component using the new color seems to be a little bit transparent.
In this picture you can see that Color2 divs are somehow transparent:

Related

How to "wash out" colors with CSS filters?

I am trying to use CSS filters to create a "disabled" look for components I am working on. I am trying to make it so that everything is "washed out" a bit. I can create this effect by using opacity(0.75) for components which are on white background: then black becomes gray and all strong colors become a bit more white. But the issue is if the component is not on white background, then opacity does not work as I would like. So how could I use CSS filters to create this "wash out" look? Like to multiply with white color a bit all colors.
I tried contrast but it looks like everything goes to gray, not white (so black stays black much longer than with opacity, while other colors are already washed out).
Using a combination of Contrast and Brightness filters might give you what you need:
filter: contrast(30%) brightness(150%);

Apply opacity to theme color keeeping the tie to the original color

In Google Slide, I would like to use a theme color and apply opacity to it.
I know I can do this by adding a new color and setting the transparency, the problem is that when I change the theme color, the new transparent color will not change.
Up until today, I thought this was just a missing feature in Google Slides, but a template I bought from a marketplace, has this exact feature, i.e. there is a shape which has a theme color and is also transparent, the problem is that I cannot change the transparency without incurring in the above mentioned problem.
My question is, is there a way to change the transparency and also keep the color tied to the theme color?
As an example, what I want to achieve is: create shape_1 and give it theme_color_1 (let's say it is #0029FFFF). Set transparency of shape_1 to 50% (so the color is #0029FF80). Change theme_color_1 (say to #44FF32FF). I want shape_1 to have new color #44FF3280.

CSS overlay vs same looking other color

Strange I faced this question just now - are there any differences between css background color overlay and same looking color? For ex: designer designed buttons for hover, focus etc. On hover he wrote - overlay #FFF 15%. Now sice we use mixins and colors are hex, I have two choices - wrap element with other div or convert my rgba color rgba(255,255,255,0.15) to rgba #FFFFFF26 and use a pseudo class to apply it on hover.
It looks ugly, why not just other background color on hover?
I can get a hex color like this rgba(255,255,255,0.15) and it looks the same...
What are the benefits of overlay color (are there any?)?
If you have overlay with transparency then the background color will be seen through the overlay. If you apply directly on the button then what is behind it will show (in most cases white) so you have 2 different results

How can I set the backgroundColor of a WKInterfaceController programmatically?

I couldn't find any way of changing the overall background color of the Watch app interface programmatically.
I therefore tried creating a fullscreen WKInterfaceGroup and changing the backgroundColor of that.
centralGroup.setBackgroundColor(UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0))
However, I still have unfilled rounded corners and lines on borders.
Is there any way to achieve my goal, of an edge-to-edge background color that fills the screen?
While you can set a background color for a WKInterfaceController in the storyboard, there is no API that lets you programmatically set it in the present Xcode 6.2 beta 3.
However, you can create a full screen WKInterfaceGroup and set the color of that programmatically. If you also setCornerRadius: to 0 you get the following result:
Clearly, there are still black lines at the edges here. The other possibility was that setting a solid color image as the background might perhaps scale to fill the full screen with one of the scaling options, but I tested this and the result is identical to the above.
However, it is important to consider the hardware this will be running on. Apple have said more than once in their public statements about the Watch that the intersection between the laminated screen and the edges is so seamless that you essentially can't tell where the screen ends and the edges begin. Taking this at face value, as long as you set the background color of the WKInterfaceController to clear or black in interface builder, so that these edges are black to match the screen surround, then these black lines should be invisible to the end user and are something you can safely ignore.
This is how I done it:
Add WKInterfaceGroup and setCornerRadius to 0
Go to WKInterfaceController Attribute Inspector and change Left/Right insets to 0 (Fig.1) (This will remove the extra black line on the left & right side)
Change the color of the WKInterfaceGroup to whatever you want :)
Fig.1
Change insets of Your WKInterfaceController to custom and set all to 0. Also, change corner radius of group to 0 too. Enjoy.
Try changing the corner radius of the WKInterfaceGroup to 0. You can use setCornerRadius: to change the corner radius.

How can use transparent color in QColorDialog for clear background color of text?

I use QColorDialog and execCommand() hilite for changing background color of text. I changed background color of a part of my text to red for example, And again I want to clear the background color to transparent (Not white).
How can I do this? Is there a way to add transparent color option to QColorDialog? Or what?
Thank You,
If you use static QColorDialog::getColor function, pass QColorDialog::ShowAlphaChannel as the 4th argument.
If you use QColorDialog object, use dialog.setOption(QColorDialog::ShowAlphaChannel).

Resources