Chromeのブラウザはアップデートをチェックしていましたが、デベロッパーツールはなんとなくしか見ていませんでした。

デベロッパーツールで、CSSのcalc()やclamp()などの複雑な計算式やvwやcqwなどの相対単位が簡単にデバッグできるようになっています。

Debug complex CSS values easier

不朽のデザイン書「ノンデザイナーズ・デザインブック」の28周年を記念して、3年ぶりとなる期間限定のキャンペーンが開催されています！

なんと応募者全員に、日本語のテキスト・フォント・タイポグラフィについて解説した特典PDFがもらえます。

iOSにLiquid Glassが採用されてから早半年が過ぎました。
当初はiPhoneやiPadのUIに使いにくさを感じていましたが、Liquid Glassを採用しているアプリも増えた最近では逆に採用されていないアプリのUIを見るとちょっと古くさい感じがしたりします。

UIで使われるカードやボタンをLiquid Glassをはじめ、GlassmorphismやNuemorphismにするCSSをコピペで簡単に実装できるコードを生成するツールを紹介します。

Aether CSS

※本ページは、アフィリエイト広告を利用しています。

ここ数年、Canvaの躍進が目立ちます。
一昔前はできることは限られていましたが、現在ではかなりいろいろなことができ、プロユースとしても十分な機能を備えています。

Canvaの解説書として人気が高い『Canva使い方入門』が、2026年1月現在のCanvaの最新UIに対応し、さらに分かりやすく、もっと役立つ内容になった増補改訂版を紹介します。

iPhoneやiPadのスクリーンサイズと解像度とピクセル密度っていくつだっけ？ GalaxyやPixelのスクリーンサイズと解像度とピクセル密度は？

もちろんそれぞれの公式サイトで探せば見つかりますが、けっこう手間です。さまざまなデバイスのスクリーンサイズや解像度やピクセル密度などの仕様が一覧できる便利なサイトを紹介します。

古いデバイスのスクリーンサイズや異なるブランド間での比較などもできるので、公式サイトではできないこともできます。

What Is My Screen Size?

「藍原相撲字」「藍原江戸文字」「藍原勘亭流」「藍原筆文字楷書」「藍原筆文字隷書」などの手書きフォントをリリースされている藍原彼方さんから、新作の筆文字フォントがリリースされました！

無料版と有料版が用意されており、無料版ではひらがな・カタカナをはじめ、一部記号文字、教育漢字（240文字）などが収録されています。

カーソルで下からホバーすると弓の弦のように上から弾け、上からホバーすると下から弾ける、操作するのが楽しくなるホバーエフェクトを紹介します。

弓の弦のように弾けるホバーエフェクトはモダンCSSの機能（shape(), sibling-index()/sibling-count(), linear()など）で実現されており、コピペで簡単に実装できます。

ブラウザに表示したあらゆるWebページにレスポンシブに対応したFigmaみたいなグリッドをオーバーレイー表示できるChromeの機能拡張を紹介します。

グリッドのオーバーレイはブラウザ内で完全にローカルで実行されるため、オンラインのWebページだけでなく、ステージングやローカル環境でもグリッドを表示できます。