経緯
Twitterのアイコンが丸くなってからもう２年半。
「今では例えばアイコンが円いことに誰も違和を抱かないな」
という主張を見かけるが、残念ながら私はまだ違和感を覚える。
というのも、元々丸いアイコン前提のデザインなら良いが、
明らかに四角前提のアイコンもあって違和感でしかない。
自分のアイコンも四角なデザインで、この Qiita の表示通り。
Twitter で使うアイコンも同じ四角い元画像を使っている。
たまたま丸く収まってるから、そのまま放置しているだけ。面倒いし（ぁ
今思えば、変更当時は結構大変だった公式アカも居たもんだ。
例えば、タカラトミーさん（のアイコンメーカー）
https://www.itmedia.co.jp/news/articles/1707/18/news026.html
他は matome が詳しい。
https://matome.naver.jp/odai/2149758066866700401
理屈では、アイコンが丸くなって失われたの情報量は最大で 21.46% らしい。
https://togetter.com/li/1120825
ということで、思い出した以上、丸角四角に戻したくなるもの。
手順
-
ブラウザで Twitter のページを開く。（Windows × Firefox で確認）
-
F12キーを押して「開発ツール」を表示させる。
-
開発ツールの一番左上の「
」を押して、要素選択モードに入る。 -
任意のアイコンにカーソルを合わせてクリック。
-
開発ツールで
<div class="css-...がハイライトされていることを確認。 -
その２つ上に
<a class="css-...があるのを確認してクリック。 -
スタイル領域から
border-radius: 9999pxを含む.r-sdzlijを探し出す。
-
9999pxをダブルクリックして0.3emに書き換える。
これで開いた画面のみならず、
「ホーム」や「通知」に移動しても丸角四角のスタイルが引き継がれる。
結果
丸四角いアイコンを堪能しよう
