CSS蛍光ペンマーカーにグラデーション指定
よくあるCSSマーカーでグラデにしたい依頼があったので試行錯誤の末なんとかできたのでメモメモ
サンプルここで改行
サンプル
ええんちゃう(アカネチャン)
background-image: linear-gradient(#ffffff 70%,rgba(0,0,0,0) 70%),linear-gradient(90deg, #baffb9 0%,#ffdaa7 33%,#ffc9bb 66%,#e6ddff 100%);
白背景のみ有効。ちなみに背景色ある場合は都度都度classなんかでかえないといけない
マスクとかで透過できれば汎用性は高くなるぽいけど透過できないかなー
追記(2021.05.06)
https://web-dev.tech/front-end/css/how-to-set-gradient-marker-on-css/
こちらのサイト流用でできそう
background-image: linear-gradient(90deg, #baffb9 0%,#ffdaa7 33%,#ffc9bb 66%,#e6ddff 100%); background-repeat: no-repeat; background-position: bottom; background-size: 100% 40%;
サンプルここで改行
サンプル
できたー٩꒰。•◡•。꒱۶(YATTA)