Questions tagged [gradient]
Specifies a range of position-dependent colors, usually used to fill a region.
gradient
4,347
questions
1417
votes
21
answers
1.1m
views
How do I combine a background-image and CSS3 gradient on the same element?
How do I use CSS3 gradients for my background-color and then apply a background-image to apply some sort of light transparent texture?
- 16.3k
508
votes
13
answers
451k
views
CSS3 gradient background set on body doesn't stretch but instead repeats?
ok say the content inside the <body> totals 300px high.
If I set the background of my <body> using -webkit-gradient or -moz-linear-gradient
Then I maximize my window (or just make it ...
- 57.1k
357
votes
22
answers
862k
views
How to do gradient borders in CSS
I'm trying to apply a gradient to a border, I thought it was as simple as doing this:
border-color: -moz-linear-gradient(top, #555555, #111111);
But this does not work.
Does anyone know what is the ...
- 32.8k
308
votes
11
answers
595k
views
How to make gradient background in android
I want to create gradient background where the gradient is in the top half and there's a solid color in the bottom half, like in this image below:
I can't because the centerColor spreads out to cover ...
- 9,898
294
votes
10
answers
320k
views
Android LinearLayout Gradient Background
I am having trouble applying a gradient background to a LinearLayout.
This should be relatively simple from what I have read but it just doesn't seem to work. For reference sakes I am developing on 2....
- 8,078
291
votes
7
answers
420k
views
CSS3 Transparency + Gradient
RGBA is extremely fun, and so is -webkit-gradient, -moz-gradient, and uh... progid:DXImageTransform.Microsoft.gradient... yeah. :)
Is there a way to combine the two, RGBA and gradients, so that there'...
- 34.4k
221
votes
7
answers
177k
views
Gradients on UIView and UILabels On iPhone [duplicate]
Possible Duplicate:
Manually drawing a gradient in iPhone apps?
My application needs to display text in either a UIView or UILabel but the back ground must be a gradient as opposed to a true ...
- 6,607
191
votes
17
answers
77k
views
IE9 border-radius and background gradient bleeding
IE9 is apparently able to handle rounded corners by using the CSS3 standard definition of border-radius.
What about support for border radius and background gradient? Yes IE9 is to support them both ...
- 2,084
181
votes
6
answers
122k
views
Multi-gradient shapes
I'd like to create a shape that's like the following image:
Notice the top half gradients from color 1 to color 2, but theres a bottom half that gradients from color 3 to color 4. I know how to make ...
- 21k
151
votes
19
answers
63k
views
Get Slightly Lighter and Darker Color from UIColor
I was looking to be able to turn any UIColor into a gradient. The way I am intending to do this is by using Core Graphics to draw a gradient. What I am trying to do is to get a color, lets say:
[...
- 2,227
147
votes
6
answers
261k
views
SVG gradient using CSS
I'm trying to get a gradient applied to an SVG rect element.
Currently, I'm using the fill attribute. In my CSS file:
rect {
cursor: pointer;
shape-rendering: crispEdges;
fill: #a71a2e;
}...
- 11.9k
141
votes
4
answers
29k
views
Pytorch, what are the gradient arguments
I am reading through the documentation of PyTorch and found an example where they write
gradients = torch.FloatTensor([0.1, 1.0, 0.0001])
y.backward(gradients)
print(x.grad)
where x was an initial ...
- 4,303
134
votes
5
answers
185k
views
Gradient of n colors ranging from color 1 and color 2
I often work with ggplot2 that makes gradients nice (click here for an example). I have a need to work in base and I think scales can be used there to create color gradients as well but I'm severely ...
- 110k
127
votes
8
answers
128k
views
Circular gradient in android
I'm trying to make a gradient that emits from the middle of the screen in white, and turns to black as it moves toward the edges of the screen.
As I make a "normal" gradient like this, I have been ...
- 14.4k
112
votes
10
answers
159k
views
Gradients in Internet Explorer 9
Does anyone know the vendor prefix for gradients within IE9 or are we still supposed to still be using their proprietry filters?
What I've got for the other browsers is:
background-image: -moz-...
- 6,292
97
votes
4
answers
106k
views
How do I programmatically set the background color gradient on a Custom Title Bar?
There are many tutorials out there and questions on SO that implement custom title bars. However, in my custom title bar I have a custom gradient for the background and I would like to know how to ...
- 5,566
95
votes
5
answers
144k
views
Using CSS, can you apply a gradient mask to fade to the background over text?
I have a full screen fixed background image. I would like the text in my scrolling div to fade out at the top, presumably by applying a gradient mask to the background at only the top part of the div. ...
- 1,573
92
votes
8
answers
80k
views
Can I apply a gradient along an SVG path?
I'd like to put a simple loading indicator on my website that's triggered by a script. It should be a simple circle arc that's got a gradient and is spinning while the user is waiting. I haven't tried ...
- 19.4k
89
votes
6
answers
58k
views
CSS gradient checkerboard pattern
I want to create a checkerboard pattern using gradients. I've found an example and modified it to my needs, however it only works with -moz prefix. When I remove the -moz prefix, the pattern is ...
- 15.8k
88
votes
7
answers
79k
views
Android: Using linear gradient as background looks banded
I'm trying to apply a linear gradient to my ListView.
This is the content of my drawable xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/...
- 23.5k
82
votes
5
answers
85k
views
angle attribute in android gradient
I am going through test example. Where for some Image background they are using gradient,
the code goes like this
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://...
- 4,324
82
votes
7
answers
150k
views
wrapping Scaffold with Container for gradient background, How to set gradient to container background in flutter?
I'd like to wrap a Scaffold with a Container in order to get a gradient background that's also underneath the AppBar. Basically a full screen gradient background. However, my attempt doesn't do ...
- 1,332
80
votes
3
answers
65k
views
How to make transparent gradient?
I have the following gradient:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:...
- 60.5k
76
votes
5
answers
204k
views
Use CSS gradient over background' image
I've been trying to use a linear gradient on top of my background image, in order to get a fading effect on the bottom of my background, from black to transparent, but can't seem to be able to make it ...
- 4,130
74
votes
10
answers
177k
views
How to create colour gradient in Python?
I want to create a new colormap which interpolates between green and blue (or any other two colours for that matter). My goal is to get something like:
First of all I am really not sure if this can ...
- 1,880
71
votes
7
answers
121k
views
How to plot a gradient color line
To state it in a general form, I'm looking for a way to join several points with a gradient color line using matplotlib, and I'm not finding it anywhere.
To be more specific, I'm plotting a 2D random ...
- 1,013
68
votes
5
answers
44k
views
Android Jetpack compose gradient
Is it possible to draw a gradient over an image drawable using Jetpack Compose?
fun HeroCover() {
Column {
val image = +imageResource(R.drawable.edge_of_tomorrow_poster)
Container(...
- 2,684
66
votes
15
answers
114k
views
Javascript color gradient
Using javascript with or without Jquery, I need to a create a gradient of colours based on a start and finish color. Is this possible to do programmatically?
The end colour is only ever going to be ...
- 661
63
votes
3
answers
158k
views
Fade image to transparent like a gradient
I would like to have an image (a background image) to fade to transparent so that content behind it can actually be seen (barely, thanks to transparency).
I can achieve it obviously with a PNG image, ...
- 11.5k
61
votes
8
answers
103k
views
Flutter - How to blend an image with a gradient colour?
I am attempting to replicate a login screen design my designer did for an app.
The background image uses a blendMode of softLight, the catch is that the colour it blends with is a gradient colour. ...
- 8,257
61
votes
2
answers
41k
views
How to set gradient style to paint object?
The code for drawing an arrow with Style: Fill is given below:
paint.setColor(Color.parseColor("#bdc0dc"));
paint.setStyle(Style.FILL);
canvas.drawPath(arrowPath, paint);
paint.setColor(Color.BLACK);...
- 1,608
57
votes
4
answers
123k
views
Colour points in a plot differently depending on a vector of values
I'm plotting the figure below using R's plot() function. It is a plot of a vector shiftTime of shift in time. I have another vector intensity of the intensity values ranging from ~3 to ~9. I want to ...
- 8,624
57
votes
7
answers
142k
views
Gradient text color
Is there a generator , or an easy way to generate text like this but without having to define every letter
So something like this:
.rainbow {
background-image: -webkit-gradient( linear, left ...
- 741
55
votes
5
answers
34k
views
CSS3 gradient rendering issues from transparent to white
I am having issues with cross browser rendering of CSS3 gradients. This is happening when I am trying to create a gradient from transparent colour to white.
The file I am using to test with is:
http:/...
- 1,341
55
votes
8
answers
61k
views
How can I prevent CSS gradient banding?
I started using CSS gradients, rather than actual images, for two reasons: first, the CSS gradient definitely loads faster than an image, and second, they aren't supposed to show banding, like so many ...
- 719
54
votes
6
answers
116k
views
How to convert x,y coordinates to an angle?
Microsoft provide an excellent SVG gradient maker so IE9 can also have "CSS3" gradients (click Custom).
I currently utilise their logic for my Fireworks and Dreamweaver extensions to convert ...
- 6,213
52
votes
4
answers
55k
views
Fixed gradient background with css
I would like for my page to have a gradient background flowing from top to bottom. I want the background to act like a fixed image in that the gradient stretches from the top of the current browser ...
- 33.1k
49
votes
11
answers
88k
views
Gradient colors in Internet Explorer
I know that Internet Explorer has some proprietary extensions so that you can do things like create divs with a gradient background. I can't remember the element name or it's usage. Does anyone have ...
- 45.5k
46
votes
4
answers
51k
views
Gradient Text in Flutter
I was wondering if it is possible to create a gradient over text
Flutter. There is a gist of text gradient using Dart's ui, but it is kinda long and I was hoping to be simpler.
- 20.7k
46
votes
6
answers
80k
views
How do you remove the default Bootstrap 3 carousel control background gradients?
I'm pretty sure this is the code I need to modify, but for some reason I can't get the gradients to disappear in IE. I want them completely gone!
.carousel-control {
text-shadow: none;
opacity: 1;
...
- 565
46
votes
3
answers
29k
views
Calculate the color at a given point on a gradient between two colors?
So this is essentially the method I would like to write (in Objective-C/Cocoa, using UIColors, but I'm really just interested in the underlying math):
+ (UIColor *)colorBetweenColor:(UIColor *)...
- 805
44
votes
4
answers
100k
views
Gradient over img tag using css
I want to place a gradient over an <img> tag. src attribute of the tag is angular-item. For example:
<img src={{value.angitem.image}}>
I've tried to make css class:
.pickgradient {
...
- 653
44
votes
6
answers
129k
views
Transparent Background Image with a Gradient
Today I was designing a transparent PNG background that would only sit in the top left of a div, and the rest of the div would maintain a gradient background for all transparent areas of the PNG, and ...
- 1,054
43
votes
3
answers
116k
views
How to add gradient effect to background color of TextView in a ListView?
In reference to these questions:
Adding gradient effect to TextView in a ListView generates NPE
How to change color and font on ListView
I would like to know how to go about setting the background of ...
- 15k
39
votes
1
answer
53k
views
How to draw a smooth/dithered gradient on a canvas in Android
Several answers mention to use GradientDrawable.setDither(true) to draw smooth gradients in Android. That has no effect in my code. Any idea what I have to change to get a well looking gradient in my ...
- 2,333
38
votes
3
answers
26k
views
Applying a Gradient to CAShapeLayer
Does anyone have any experience in applying a Gradient to a CAShapeLayer? CAShapeLayer is a fantastic layer class, but it appears to only support solid fill coloring, whereas I'd like it to have a ...
- 541
38
votes
9
answers
75k
views
Gradient that stops at a particular height and continues further with a solid color
I want to have a gradient in HTML/CSS.
Assume some DIV is always more than 400px tall. I want to add the gradient so that it is #FFFFFF at the top and #EEEEEE at 300px. So the first 300px (height-...
user529141
36
votes
11
answers
53k
views
How do I add a gradient to the text of a UILabel, but not the background?
hey, I want to be able to have a gradient fill on the text in a UILabel I know about CGGradient but i dont know how i would use it on a UILabel's text
i found this on google but i cant manage to get ...
- 5,163
36
votes
8
answers
38k
views
SVG angular gradient
Is there a way to do an 'angular gradient' in SVG?
(I don't know the official term -- it's the kind of gradient you see in color-pickers, where it varies by angle.)
SVG seems to support only linear ...
- 1,281
35
votes
2
answers
85k
views
White to transparent gradient with background image
I need to apply a white to transparent gradient which covers about a 1/4 of the top of the page and a background image visible for the rest of the page.
Im looking to achieve a seamless blend from a ...
- 783