Grained.org - Online grained gradient image generator(grained.org)
grained.org
Grained.org - Online grained gradient image generator
http://www.grained.org
14 comments
Haha! This is the sort of stuff we should see more often on HN. I'd just like to say that I love the tagline -- "because CSS gradients are just not there yet". Just imagine the poor sods who wrote the gradient renderer in the popular browsers. To me, the gradients generated by the site do look really good, and if these are beyond CSS3, then CSS3 should be expanded.
Cool, but why is there no setting to change the length/radius of the gradient? The "radius" slider only changes the contrast (but curiously only in radial mode), not the size.
Bug report: The color up/down thingies become stuck so that any mouse movement will change the value. (Chrome 15 on Lion.)
Bug report: The color up/down thingies become stuck so that any mouse movement will change the value. (Chrome 15 on Lion.)
Working beautifully on Windows Chrome 14.0.835.163 Very nicely done!
Ron. Pretty awesome. Just playing with it on Chrome and am pleased with the effects. Adding more than one gradient would be a useful feature as others have noted. Keep up the good work
Thanks man
Your height truncates, it does not actually alter the distance of the gradient (chrome canary, osx)
You'll have to recreate the gradient once you resize.
Fixed a few issues, now works on Opera as well.
locks up my chrome 14.0.835.186 on arch
Works fine for me on chrome 14.0.835.186 on OS X 10.7
The design of the site is quite good, but the mouse events on the canvas to control the shape of the gradient don't seem to work at all under Opera (it's fine under Chrome).
As a suggestion, gradients with more than 2 colors (a Photoshop style adding intermediate colors on a line or something similar) would be a useful feature to add.
As a suggestion, gradients with more than 2 colors (a Photoshop style adding intermediate colors on a line or something similar) would be a useful feature to add.
Thanks for the heads up. I'll fix it.
The color stop feature is actually pretty easy to add, it's only a question of where to put the color selector now...
Maybe you could do it like this guys: (http://gradients.glrzad.com/) (you click the plus button to add a new color)
Awesome, looks good and usable. Will do.
Uncaught TypeError: Object [object HTMLCanvasElement] has no method 'relMouseCoords'
on chrome 14 OSX 10.6
on chrome 14 OSX 10.6
Hey riffraff, could you please email me at [email protected] with the log? Thanks.
I will, but mind you there isn't much in the console
Reminds me a bit of the Javascript "text color gradient" generators of the 90's. But much cooler. Nice toy :)
On a positive note, no issues on OSX 10.6.7 with FF 6.0.2 :)
Mm, it seems to require high noise levels to not look visibly stripey. Is it actually dithering the colors, or just overlaying noise on top of it?
It uses the canvas gradient to create it, and then atop of that it dithers the colors using pixel manipulation. AFAIK there are no dithering techniques in the gradient creation itself, only the grain I add manually after creating the gradient.
And it's just noise I'm adding, I don't dither the colors.