Flowing Gradient Text

Flowing Gradient Text

テキストの背景グラデーションが流れるやつ作った

もとはこれ( SELECTABLE TEXT )です。

背景に画像を使ってたのを、

  background-image: linear-gradient(45deg, rgba(20,123,150,1) 0%, rgba(229,209,6,1) 50%, rgba(20,123,150,1) 100%);
  background-size: 8000px 1px;
  background-repeat: repeat;

というCSSに変えた。
他は特に大きく変えてないけど、animation 全然触ってなかったのでそこに時間がかかった。

あと、background-image 指定して、

  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

っていうのすごくお便利じゃないか !!?
参考はこちら ( Gradient Text )