Underline with full gradient while evading

Questions
,
1

How do you do an underline where the gradient goes across the full text without breaking up the gradient and repeating it? I want to leave evade on, but doing so causes the gradient to ‘restart’.

#set text(30pt)

#underline(
  stroke: gradient.linear(..color.map.turbo)
)[A drop to show repeat gradient]

#underline(
  stroke: gradient.linear(..color.map.turbo),
  evade: false
)[A drop to show repeat gradient]

#underline(
  stroke: gradient.linear(..color.map.turbo),
  evade: false,
  background: true
)[A drop to show repeat gradient]

image
image399×185 23.1 KB

2

You can use the relative parameter for this.

#underline(
  stroke: gradient.linear(..color.map.turbo, relative: "parent")
)[A drop to show repeat gradient]
2 Likes
3

According to the docs, you actually also have to wrap it in a box or block to get content-dependent gradient length. Although, depending on your needs the choice can change. Including not using any of them.

#set underline(stroke: gradient.linear(..color.map.turbo, relative: "parent"))
#box[#underline[A drop to show repeat gradient]]

image

4

Ok thank you, I didn’t even think to be looking at the gradient docs for that and even looking at that there’s no way I would have understood that what it did.

I don’t even know how you’d create text outside of a block or box so I don’t think I’ve done that :smiley: