Gradient Text

majadc.com

SCSS code

.text-gradient {
	color: $color-5;
	@supports ( background-clip: text ) or ( -webkit-background-clip: text ) {
		background-image: linear-gradient(to right, $color-5 10%, $color-10 30%);
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
		
	}
}

CSS code

.text-gradient {
  color: #c52033;
}
@supports (-webkit-background-clip: text) or (background-clip: text) {
  .text-gradient {
    background-image: linear-gradient(to right, #209cc5 10%, #4f854c 30%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
  }
}

Resources

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.