Как задать градиент блоку так чтобы другой блок c span через transparent унаследовать часть градиента?

Question

[rm root]

Хочу сделать без костилей) нужно сделать как на картинке, не понимаю как это сделать в голову ничего не приходит ( на нумерацию не смотрим это пока что не нужно

вот тут я пытался что-то сделать

Comments

[Ankhena]

clip-path
Либо вместо градиента делать сплошной цвет для каждого элементика.

[rm root]

Ankhena, "делать сплошной цвет для каждого" вот это я пытаюсь избежать.
clip-path не совсем понимаю как с помощью него можно это сделать ?

Answer 1

[RAX7]

Можно с помощью box-shadow накрыть часть градиента, чтобы получить такой эффект, но это тоже костыльный способ.

Либо вариант с clip-path

Comments

[Ankhena]

А мне нравится :)