ブックマーク
-
提案書の作成などをわずかなプロンプトからAIで図解まで生成してくれるサービス 生成した図解のみをダウンロードすることもできるのでパーツ利用にも活用できる
-
様々なサービスのアイコンがSVGでまとめられているのでサービスごとに探しに行かなくて済む
-
JSON整形、JavaScriptの圧縮、ダミー画像生成、クレジットカード番号の生成、diff、QRコードの生成などエンジニアがよく使うツール群をまとめたWebサービス
-
GMOが運営する生成AIのプロンプトポータルサイトGPT-4oが無料で使えるのは魅力
-
数値や日付をさまざまな形式の文字列に変換できるJavascriptの「toLocaleString()」利用方法と注意点など
-
line-heightの上下余白をカットする為のスタイルと考え方
-
console.log()以外のメソッドまとめ
-
web制作(ツール)の学習サイト CSS/Figma/STUDIO/WPなど初学者はひとまずこちらを見てみるのもありかも
-
HTMLを元に1クリックで対応した空のCSSを生成してくれるので作業効率があがるかも
-
画像圧縮サービス png以外にwebpやjpegの同時圧縮やWordPressプラグインも提供しており圧縮率が優秀
-
ハンバーガーメニューについてアクセシビリティ面で気にかけるべき実装方法を網羅されているのでお手本にしたい
-
HTMLメールコーディングの際に主要なメーラーのCSS対応状況が確認できるサービス
-
SVGアイコン集 Figmaプラグインもある
-
Windows用の公式ツール ファイル・フォルダの一括置換やSVGのプレビュー機能など、なぜ標準で入ってないのかわからないレベルのツール群
-
CSSだけでグリッチ効果とRGBずらし(ホラー演出などでよくあるやつ)を付与する方法 ※少々ニッチだけどhover演出などピンポイントで使えるケースがあるかも
-
CSSグラデーションをGUIで生成するWebサービス RGBによるグラデーションでくすむ色をoklch, hsl指定できれいに補完してくれる
-
adobeの画像生成AI GUIで直感的に操作でき 学習元の権利侵害がないためデザインの素材制作に有用
-
ドメインのスパム判定チェック 国内運営なので出力結果もわかりやすい
-
黄金比 白銀比 白金比 の比率計算サービス 白金比まで出してくれるのが珍しく、縦横比だけでなく横幅に応じた比率を算出してくれる
-
UIパーツ集 ボリュームもあり、ソースコードも公開されていてアイデアの源泉になる
-
CSSイージングのcubic-bezierを視覚的に調整できるサービス
-
CSSのイージング関数のチートシート
-
font-sizeをレスポンシブ(clamp)指定する際の計算をしてくれるサービス 画面サイズごとの変化をグラフ(or表組)表示してくれるが基準値の指定までしないといけないので少々知見が必要
-
font-sizeをレスポンシブ(clamp)指定する際の計算をしてくれるサービス minとmaxを入力するだけのシンプルなUI
-
フロントエンド全般のアクセシビリティについて
-
UIデザインのための心理学:33の法則・原則(実例つき)※主に管理画面、入力インターフェイス