Lesigner Girl
Global Administrator
Head of Runboard staff
Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
|
Reply | Quote
|
|
Re: What do I call this background?
I don't have any ideas about names, but I like how you used CSS gradients instead of an image.
You could actually go one step further and create multiple gradients at different angles.
I played around with it, and came up with this:
.whatever {
display: block;
min-height: 100px;
background-color: #000;
font-size: 120%;
color: #fff;
padding: .5em 1em;
background-image:
linear-gradient(rgba(0,255,0,.07) 1%, transparent 99%),
linear-gradient(
90deg,
rgba(0,255,0,.13) 20%,
rgba(255,0,0,.13) 40%,
rgba(0,0,0,.13) 80%,
rgba(0,0,0,.13) 100%
),
linear-gradient(
90deg,
rgba(100,0,0,.20) 30%,
rgba(255,255,255,.19) 80%,
rgba(100,0,0,.20) 100%
),
linear-gradient(
rgba(0,0,0,.17) 2%,
rgba(255,0,0,.18) 12%,
rgba(255,0,0,.18) 30%,
rgba(0,255,0,.18) 65%,
rgba(0,0,0,.18) 85%
),
linear-gradient(
45deg,
rgba(255,255,255,.17) 5%,
rgba(0,0,0,.1) 25%,
rgba(255,0,0,.2) 30%,
rgba(255,0,0,.2) 40%,
rgba(0,0,0,.2) 60%,
rgba(0,0,0,.2) 70%,
rgba(255,255,255,.2) 80%
),
linear-gradient(
-45deg,
rgba(255,255,255,.17) 2%,
rgba(0,0,0,.1) 30%,
rgba(255,0,0,.2) 45%,
rgba(255,0,0,.2) 55%,
rgba(0,0,0,.2) 65%,
rgba(0,0,0,.2) 80%,
rgba(255,255,255,.2) 95%
);
background-size: 15px, 25px, 35px, 45px, 100px, 85px;
}
|