トグルボタンとは？

トグルボタンとは、オンオフ(ON / OFF)があるボタンのことを指します。

トグルボタンを設置することで、ユーザはスムーズにページ（要素）を切り替えることが可能になります。
例えば、ウェブサイトやアプリの場合はタブ切り替えの時に使ったりしますね！

混乱しやすいトグルボタン

まずは、どんなトグルボタンが混乱しやすいのかを見ていきましょう！

みなさんは、どちらがアクティブだと思いますか？
人によっては「白くなっている方がアクティブ」もしくは「プライマリーカラーが使われている方がアクティブ」と感じると思います。

どちらが正しいのか分からないデザインは、ユーザにとってストレスになる可能性が高くなります。

分かりやすいトグルボタン

それでは、どのようなトグルボタンが分かりやすいのでしょうか？

解決方法その１
テキストに（ON / OFF）を明記してみる！

ちょっと微妙ですね・・・。
明記する場合は、スライド式のトグルボタンが良いかもしれないですね！！

解決方法その２
プライマリーカラーとグレーを使う！

このように非アクティブなボタンに関しては、グレーボタンを使うと良いかもしれないですね！
グレー（グレースケール）は「非アクティブな要素」「ネガティブボタン」に使用されることが多いのでオススメです。