Looking to combine CSS fill color and SVG pattern on an SVG element

Question

I\'d like to use the awesomeness of CSS to style SVG elements in combination of 2 things: fill color and texture. My textures are created using SVG patterns that have a stro

Answer 1

You can't do quite what you want because when you set the fill to the texture you overwrite the original fill. The only way I can see around this is to write two rects on top of each other and only texture the top one.

For example:

It's not ideal, but it works.