[CSS]CSSアニメーションを使用したポップでキュートなボタン

現在Safariのみに実装されているCSSアニメーションを使用して実装するボタンを紹介します。

デモのキャプチャ

Radioactive Buttons
demo

上記デモはSafariでご覧ください。ボタンのグラデーションがまぶしいくらいにアニメーションします。

Firefoxなどのアニメーションに対応していないブラウザでは下記のように表示されます。
個人的にはデザインはこれで充分のような気もします。

デモのキャプチャ

Firefoxでのキャプチャ

アニメーションのスタイルシートは下記のようになります。

sponsors

top of page

©2018 coliss