Change svg color in pseudo element

p:after {
  width: 48px;
  height: 48px;
  display: inline-block;
  content: '';
  -webkit-mask: url(https://gist.githubusercontent.com/mmathys/fbbfbc171233a30e478ad5b87ec4f5d8/raw/cd9219e336b8f3b85579015bdce9665def091bb8/heart.svg) no-repeat 50% 50%;
  mask: url(https://gist.githubusercontent.com/mmathys/fbbfbc171233a30e478ad5b87ec4f5d8/raw/cd9219e336b8f3b85579015bdce9665def091bb8/heart.svg) no-repeat 50% 50%;
  -webkit-mask-size: cover;
  mask-size: cover;
}

.red:after {
  background-color: red;
}

.green:after {
  background-color: green;
}

.blue:after {
  background-color: blue;
}

Source: stackoverflow.com

Similar codes

0 vote192 views1 answer
Module build failed: TypeError: Invalid PostCSS Plugin found: [0]
CSS
0 vote189 views1 answer
Set margin to none inside print
CSS
12 votes189 views2 answers
Grid template columns
CSS
0 vote176 views1 answer
Flask sqlalchemy array column
CSS
3 votes186 views2 answers
Downgrade composer to 1 in vagrant
CSS
3 votes190 views1 answer
Trash icon favicon
CSS
1 vote177 views1 answer
Hover button scss
CSS
2 votes192 views2 answers
Remove input styling
CSS
2 votes196 views1 answer
Bootstrap dark mode
CSS Bootstrap
0 vote186 views2 answers
Css selector label for
CSS