61のWebツールやテクを紹介中
Collective
Daily Doze
アイデアが止まらない、グラフィックデザイナーの秘密道具箱
61個のWebツールが見つかりました
カテゴリー
＋もっと見る
キーワード
＋もっと見る
スタイル
＋もっと見る
5日前
Josh W. Comeau氏が、CSSでheight: 50%がしばしば失敗する理由と、パーセンテージのheightを親のheightやGrid、Flexboxで使えるようにする方法を、デモ付きで詳しく解説しています。
チュートリアル📘
HTML/CSS
1週間前
🧭パスに沿って配置したい方へ。間隔と方向をカスタマイズ可能なオプションを使用して、ベクターパスに沿ってオブジェクトを自動的に配置するFigmaプラグイン。
プラグイン
Figma
1週間前
Webページの見える部分 (フォールドより上) をレンダリングするために必要な最小限の CSS ルールのセット、「クリティカルCSS」をURLを入力するだけで生成してくれるツール。
ツール・ジェネレータ🛠️
HTML/CSS
1週間前
オンラインにいるユーザーが10秒ごとに道順やラジオ局の変更について投票する、共同のストリートビュー・ロードトリップ・シミュレーター。
ツール・ジェネレータ🛠️
1週間前
Tailwind CSSで利用できるクラス名をすべてまとめたチートシート。Tailwind v4にも対応済み。
ツール・ジェネレータ🛠️
Tailwind CSS
1週間前
Reactとshadcn/uiで作られたボタンコンポーネントで、本当に押しているようなフィードバック付き。カスタマイズ可能なメタリックな外観は、ゴールドなどお好みの色に変更可能。
UIライブラリ
React
2週間前
AIを活用したプロトタイプ作成ツールで、プロダクトチームがUIデザインを迅速に作成し、ユーザーからのフィードバックやデータに基づいた意思決定を行い、チーム内でのコラボも可能。
ツール・ジェネレータ🛠️
2週間前
ブラウザ上でCSSスタイリングのカスタマイズができるオンラインツール。立体的に回転する3Dアニメーションを実現可能。
ツール・ジェネレータ🛠️
HTML/CSS
2週間前
CSSのmaskを利用して、カルーセルやスライダーの両端をフェードアウトさせるCSSテクニック。
スニペット✂️
HTML/CSS
2週間前
ヨハネス・フェルメールの最も有名な絵画「真珠の耳飾りの少女」を108億万画素でスキャン、ブラウザ上で閲覧できます。絵の具が劣化によりひび割れした細部までくまなくどうぞ。
インスピレーション💡
2週間前
コンテナ端の子要素の余白を自動的にトリミング、レイアウトを簡単にする新しい CSS プロパティ、margin-trim の使い方を紹介した記事。
チュートリアル📘
HTML/CSS
2週間前
Figmaでプロンプトを入力すると、プラグインが実際のデザインに変換します。さらにすごいのは、結果をリアルタイムで確認できること。
プラグイン
Figma
2週間前
NotionをつかってCMSサイトを構築できるサービス。あらゆるタイプのウェブサイトやアプリの制作に対応しています。
ツール・ジェネレータ🛠️
2週間前
Tailwind CSSとMotionで作成された、美しいアニメーションが特長のUIコンポーネント集。コピペも簡単で、カスタマイズ可能。 オープンソースMIT。
アニメーション🎞️
JavaScript, Tailwind CSS
2週間前
Claude AIとChatGPTを使い、Figmaのデザインをプロダクションレベルのコードに変換するプラグイン。React、SwiftUI、Tailwind、Flutterなどの複数のフレームワークをサポート。
プラグイン
Figma
2週間前
CSS APIとView TransitionをサポートしたアンカーポジショニングのためのTailwind CSS専用プラグイン。
Tailwind CSS
2週間前
Made With GSAPがGSAPのInertiaPluginを使ったホバーエフェクトのチュートリアルを公開しています。
アニメーション🎞️
GSAP
3週間前
GSAPが完全無料で商用利用も可能になりました。人気の高いSplitTextプラグイン、いままでは有料でしたがすべてのボーナスプラグインが無料となりました。
アニメーション🎞️
GSAP
3週間前
サムネイルをクリックすると、パスを描きながら画像が繰り返し表示されながら拡大表示されるフレームアニメーション。
アニメーション🎞️
HTML/CSS
3週間前
ウェブサイトの基本となるUIデザインベースで利用する配色カラーパレットをCSS color-mix()をつかって作成する方法を紹介。デモ配色ジェネレーターも一緒にどうぞ。
配色🎨
HTML/CSS
3週間前
ジェン・シモンズ氏が、ウェブデザインにおけるタイポグラフィの見た目を改善する、新しいCSSラインハイト単位について説明しています。従来の設定との違いを分かりやすくデモを使って体験できます。
チュートリアル📘
HTML/CSS
3週間前
Mihael Miklosicがp5.jsを使って作成した、Perlinノイズ・グラフィック・ツール。色やシェイプなどカスタマイズ可能で、エクスポートまで。
ツール・ジェネレータ🛠️
3週間前
Reactの新機能とをつかった、スムーズなUI遷移の実装についてスニペット付きで詳しく紹介しています。
チュートリアル📘
React
