Code blocks - to create Rose Gold FONTS

CSS - is under marketing tools

HTML - Add a code block to the section

⸻

1. The “y” Not Displaying Properly

This is likely caused by the gradient clipping used in the -webkit-background-clip: text; effect. Sometimes letters with descenders (like “y”, “g”, or “p”) can get cut off at the bottom, especially if the line height or overflow isn’t handled properly.

Fix it by slightly adjusting the CSS:

Update your .rose-gold-h1 CSS like this:

.rose-gold-h1 {

  background: linear-gradient(90deg, #c48d76, #e7bca8, #a76f60);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

  font-family: 'Lora', serif;

  font-size: 4rem;

  font-weight: 600;

  line-height: 1.3; /* Slightly increased */

  letter-spacing: 0;

  margin: 0;

  display: inline-block; /* Helps preserve space for descenders */

}

2. Make It Easy to Reuse Rose Gold Titles

Here’s a simple system:

Option A: Create a Notes Page (hidden from navigation)

• Add a page to your site called “Snippets” or “Brand Elements”

• Keep useful blocks like:

HTML

<h1 class="rose-gold-h1">[INSERT TITLE HERE]</h1>