<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Earum iusto aliquid magni <span class='rainbow'>totam</span>, fugiat unde est exercitationem eveniet nobis nihil, reprehenderit quo <span class='rainbow'>repudiandae</span> dolorem ipsum incidunt. Tempora blanditiis sint <span class='rainbow'>iusto?</span></p>

@import url('https://fonts.googleapis.com/css2?family=Nabla&display=swap');

@font-palette-values --bw {
    font-family: 'Nabla';
    base-palette: 0;
    override-colors: 0 black, 1 black, 2 black, 3 black, 4 black, 5 black, 6 white, 7 white, 8 black, 9 white;
}

@font-palette-values --rainbow {
    font-family: 'Nabla';
    base-palette: 0;
    override-colors: 0 #3a86ff, 1 #8338ec, 2 #ff006e, 3 #fb5607, 4 #ffbe0b, 5 #3a86ff, 6 #8338ec, 7 #ff006e, 8 #ffbe0b, 9 #ffbe0b;
}

body {
    background: #000000;
}

p {
    width: 50rem;
    max-width: 90%;
    margin: 0 auto;
    padding: 1rem;
    text-align: center;
    font-size: 2rem;
    line-height: 3rem;
    color: #fff;
    font-family: 'Nabla';
    font-palette: --bw;
}

.rainbow {
    font-palette: --rainbow;
    font-size: 3rem;
}