Logo with initials

Create a custom underline with CSS

For hover effect with underline or custom top/bottom border, see src/templates/blog-post.module.scss

.element {
  background-image: linear-gradient(var(--highlight), var(--highlight));

  /* Without this, it doesn't work and fills the entire container with a flat color */
  background-repeat: no-repeat;

  /* background-size will give you the width/height */
  background-size: 80% 1px;
  background-position: center top;
}