Firefoxのハンバーガーボタンを本物に変更する

Firefoxのハンバーガーボタンを本物に変更する方法が書かれていました。

このアイコンのことです。

よくスマホアプリなどで右上にあったりしますね。

この「ハンバーガーボタン」は、スマートフォンの流行とともにナビゲーションアイコンとして使われ始め、今やデスクトップ向けアプリでも設定メニュー等で用いられています。

Firefoxでもご多分に漏れず、右上に使われています。

この「ハンバーガーボタン」を

このような、ややリアルなアイコンに変える方法です。

例によってuserChrome.cssで変更します。

#PanelUI-menu-button > .toolbarbutton-badge-stack{
list-style-image:none;
}
#PanelUI-menu-button > .toolbarbutton-badge-stack:before{
content:"\1F354";
font-size:18px;
}

この「content:”\1F354″;」という部分がハンバーガーアイコン指定している部分です。

? (HAMBURGER) UTF-8 character | UTF-8 Icons
https://www.utf8icons.com/character/127828/hamburger

楽しくなる変更ですね。

ちなみに同様に設定可能な絵文字はほかにもあります。

All the Emoji – Chapter 9 – CodenameCarrot – No Fandom [Archive of Our Own] https://archiveofourown.org/works/6580324/chapters/15057844

userChrome.cssの変更方法などは下記を参考にしてください。

Firefoxの不要なコンテキストメニューを消す

Firefoxで「右クリックで表示される「コンテキストメニュー」から、不要な項目を消す方法のまとめです。「userChrome.css」を編集することで簡単に消すことができます。 userChrome.cssの場所 userChrome....