CSS Gradient Over Video
CSS Gradient Over Video
Out of context: Reply #5
- Started
- Last post
- 9 Responses
- PonyBoy0
layer it... drop a SVG w/gradient fill on top so you have the exact hex you need to match the site's color and the SVG will expand far better than a PNG. Set the vid and SVG file inside the same div. Set the SVG position @ absolute... if it's inside the same div as your video it should sit right on top of the video... then use a little css to scale the SVG to fit ( you may need some JS to do this... but so what ¯\_(ツ)_/¯ )
< div "videoAndSVG_Holder" >
< video >
< img SVG >
< / div >- the only reason I say to use SVG is so you can match your exact site's hex color—the svg file will about a 1/2 KB to your site. mp4 w/gradient color will be offPonyBoy
- *will addPonyBoy
- Thanks! Looking forward to trying this out. I assume I can save the SVG in its own in PS then import as a layer?mg33
- export it from illyPonyBoy
- why not use css gradient?shapesalad
- that'll work but I've run into Safari errors w/css gradients that have transparencies... especially multi-color / custom position of colorsPonyBoy