Color Gradient for Headings

:root {

--linear-gradient: linear-gradient(
        45deg, 
        #ff006e, 
        #8b00ff, 
        #00f5ff, 
        #00ff88, 
        #ffaa00, 
        #ff006e);

}

h1, h2, h3, h4, h5, h6 {
    background: var(--linear-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

How to integrate CSS-Styles in adoc Studio

  1. Create a new product style (recommended)

  • Duplicate an existing product style

  • Integrate the new CSS code into the duplicated stylesheet

This variant ensures a consistent appearance and simplifies subsequent changes, as all documents use the same centrally maintained style.

  1. Project-specific stylesheet

  • Create a styles.css file in the project.

  • Above the document title of each AsciiDoc document concerned, write the line

:stylesheet: styles.css

Learn more in our CSS documentation in the user manual.

Rainbow Scrollbar

Previous

Hover Effect in the Text

Next