サイト構築
HTMLは非常にシンプル！ 圧倒的な速さでMaterial Design 3のUIを実装できるCSSの超軽量フレームワーク -Beer CSS
Post on:2025年3月26日
ここ数年で数多くのCSSのフレームワークが登場しました。BootstrapやBulmaをはじめ、Tailwind CSSなど、それらを使用したことがある人も多いと思います。 しかし、これらの人気が高いフレームワークはバー […]
実は難しい！ CSSのborder-radiusで実装した角丸を矩形からスムーズにアニメーションさせるテクニック
Post on:2025年3月25日
CSSのborder-radiusで角丸を適用したボックスを拡大・縮小のアニメーションにするとき、最初は鋭角で、拡大したときには角丸になるようにしたいと思ったことはありませんか？ 下記のデモはうまく機能していますが、角丸 […]
AIなら超簡単で早い！ Webサイトの構造を視覚化し、サイトマップを生成できる無料ツール -AI Sitemap Generator
Post on:2025年3月18日
最近はAIによる便利ツールが増えてきましたね。既存サイトの構造を視覚化し、ヴィジュアルサイトマップを生成できるAIツールを紹介します。 サイトマップを生成するだけでなく、コンテンツもAIで生成できるので、既存サイトの改善 […]
Web制作者はダウンロードしておきたい！ CSS関連の最新版チートシートのまとめ
Post on:2025年3月13日
CSS GridやFlexboxで配置するプロパティや値は？ 最初の3つだけを指定するセレクタは？ という「あれは何だっけ？」に役立つのが、チートシートです。 CSS GridやFlexboxの各プロパティ・値でどのよう […]
これは簡単で便利！ CSSのclamp()関数を使ったレスポンシブ対応のフォントサイズの定義ができるツール -Type Scale Generator
Post on:2025年3月12日
フォントのサイズをレスポンシブ対応にするときに、最近よく使用されている実装方法はclamp()関数による流体タイポグラフィのテクニックです。CSSのclamp()関数を使用するとビューポートをベースにしてフォントサイズの […]
Web制作者必見の便利な機能が追加！ Chrome 134で新しく追加された5つのCSSの機能
Post on:2025年3月10日
Chrome 134で追加された、CSSの新しい機能5つを紹介します。 今回のアップデートで目玉となるのは、dialog要素にclosedby属性が追加されダイアログの閉じる動作が制御可能になり、select要素のスタイ […]
CSSでif()関数が使えるようになり、if else文の条件付きで値を設定できるようになります
Post on:2025年3月6日
先週、CSSで関数を自分で定義できるカスタム関数が使えるようなる（紹介記事）ことをお伝えしましたが、続報として、なんとif()関数も使えるようになるそうです。すでにChrome Canaryではif()関数をCSSで使用 […]
CSSの進化がすごすぎる！ CSSで関数を自分で定義できるカスタム関数が使えるようになります
Post on:2025年2月27日
CSSの関数って、便利なものが多いですよね。calc()が登場したときも衝撃でしたが、最近ではattr()関数がパワーアップしたり、レスポンシブ対応に必須のmin(), max(), clamp()関数、ライトテーマとダ […]
Adobeユーザーはダウンロードしておこう！ Adobe Fontsで使用できる日本語フォントすべてを一覧できるPDF 2025年最新版
Post on:2025年2月26日
2月に、Adobe Fontsで使用できる日本語フォントが増えました！（紹介記事） 今回のアップデートでは、新時代のバリアブルフォント「百千鳥 VF」をはじめ、あの「きりぎりす」のデザインシグナルからも日本語フォントが大 […]
わずか数行のコードで1つの要素を別の要素にスムーズに遷移させる、フレームワークに依存しないJavaScript -Blendy
Post on:2025年2月19日
数行のコードと外部スクリプトを記述するだけで、1つの要素を別の要素にスムーズに遷移させるJavaScriptを紹介します。 フレームワークやライブラリなど他のスクリプトに依存することなく、単体で動作し、もちろん他のフレー […]
sponsors
