すぐに使える！？動くすごいテキストエフェクト10選
2019年8月14日
近頃メインビジュアルやタイトルなどで、動きを加えたテキストをよく見かけるようになりました。動きが一つ加わるだけで、シンプルなデザインでも味が出ます。
今回もCodePenから動くものを中心にテキストエフェクトを集めてみました。
1. plastkort.nu
カードがくるくる回るエフェクト。文字は左から順番に出てきます。
シンプルでさりげない動き
See the Pen plastkort.nu by Marco Barría (@fixcl) on CodePen.0
2. burning text with two.js
筆跡みたいなエフェクト。筆記体のフォントにぴったりですね。
See the Pen burning text with two.js by Caroline Artz (@carolineartz) on CodePen.0
3. Particle to Text motion
粒が集まってテキストを作るようなエフェクト。
どこかのサイトで見たことあるような気がします。
See the Pen Particle to Text motion by ankitaShrma (@ankitashrma) on CodePen.0
4. Sketch.js + CoffeePhysics Awesomeness
粒が集まってできたエフェクト。
こちらはカーソルを近づけると粒が動きます。
See the Pen Sketch.js + CoffeePhysics Awesomeness by dhaakon (@dhaakon) on CodePen.0
5. ECP Text Motion
こちらもよく見かけるタイプのエフェクト。
下からにゅっとテキストが出てくるシンプルな動きです。
See the Pen ECP Text Motion by John Avent (@javent) on CodePen.0
6. Scroll Text Motion
スクロールしていくとパララックスのような動きをします。
これもよく見かけますね。
See the Pen Scroll Text Motion by Khopes (@Khopes) on CodePen.0
7. Text moving on y-co-ordinates with hover effect and color changing text
カーソルに合わせてテキストが偏ります。
グラデーションもいい感じに動いています。
See the Pen Text moving on y-co-ordinates with hover effect and color changing text by vishalsankpal (@vishalsankpal) on CodePen.0
8. Tilted Box
ボタンみたいにぽよんとしたエフェクト。
いつ使うの？って聞かれるとちょっと困りますが、かわいかったので紹介しました。笑
See the Pen Tilted Box by Wryte (@Wryte) on CodePen.0
9. Time Is Gold
砂時計のようにテキストが流れていくエフェクト。オシャレですね。
See the Pen Time Is Gold by Asyraf Jamil (@asyrafjamil) on CodePen.0
10. Awesome text effect
8bit調のエフェクト。
マトリックスみたいでちょっとかっこいいですね。
See the Pen Awesome text effect by Cosmic Voyager (@cosmicvoyager) on CodePen.0
