Gradient Titles

Learn how to add a gradient to the titles.

Sample SCSS code to add

Advanced -> Raw SCSS

.rui-block-title {
    background-image: linear-gradient(140deg,#ffd9cd 13%,#FF3F05 84%);
    color: #FF3F05;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

or

Class to add .rui-text--gradient

Lorem ipsum dolar set
<h2 class="rui-text--gradient">Gradient title</h2>
<p>Lorem ipsum dolar set rest of the content</p>
Custom Block Title

Last updated