ツール実践マニュアル概要

105の無料ITツール/デザイン

無料のデザインツール

グラデーション、カラーパレット、ボックスシャドウ、ファビコン、レイアウト補助など、デザイナーとフロントエンド開発者のためのツール集です。無料・即時・プライベートにブラウザで使えます。

無料ツール18件

🎨カラーパレット

画像からカラーパレットを抽出したり、プロジェクト向けの調和の取れた配色を生成します。

▫Favicon ジェネレーター

テキスト・絵文字・アップロード画像から Favicon を作成します。Web とモバイル向けに全サイズをエクスポートできます。

🎯カラーコンバーター

ライブプレビュー付きで HEX・RGB・HSL・CMYK 間の色変換を行います。

カスタム長を指定して、段落・文・単語単位のプレースホルダーテキストを生成します。

16:9アスペクト比計算機

ロックモード・一般的なプリセット・リサイズ計算機付きでアスペクト比を計算します。

Aaコントラストチェッカー

WCAG アクセシビリティコントラストチェッカー。AA/AAA 準拠・カラー提案・ライブ UI プレビュー付き。

□プレースホルダー画像

カスタム色・テキスト・パターン・グラデーション付きのプレースホルダー画像を生成します。PNG と SVG でエクスポート可能。

◇SVG エディター

SVG を貼り付けてレンダリングを確認し、ファイルサイズを最適化して色を編集し、SVG/PNG/data-URI でエクスポートできます。

✦CSS アニメーションビルダー

CSS アニメーションを視覚的にデザインします。キーフレームエディター・タイミングカーブ・プリセット・CSS 出力付き。

🌈グラデーションテキスト

テキストに CSS グラデーション効果を適用します。2〜4 カラーストップ・方向制御・プリセット付き。CSS をコピーできます。

▪ボックスシャドウジェネレーター

CSS ボックスシャドウを視覚的にデザインします。複数レイヤー・インセット・ニューモーフィズムとグラスモーフィズムのプリセット付き。

🖥スクリーンショットモックアップ

スクリーンショットを MacBook・iPhone・iPad・ブラウザのデバイスフレーム内に配置します。背景・シャドウ・PNG エクスポート対応。

Ttタイプスケール計算機

ビジュアルプレビュー付きでタイポグラフィスケールを生成します。Material・Tailwind・Bootstrap プリセット・CSS エクスポート対応。

⊟スペーシング計算機

一貫したスペーシングスケールを生成します。ビジュアルプレビュー・4px/8px プリセット・CSS カスタムプロパティエクスポート対応。

◠ボーダー半径ジェネレーター

ビジュアルな border-radius エディター。コーナーをドラッグするか値を入力して調整します。ピル・円・ブロブのプリセット付き。CSS 出力対応。

◐CSS フィルターエディター

ビジュアル CSS フィルターエディター。ブラー・明度・コントラスト・色相回転などをライブプレビューで確認できます。

📏ピクセルルーラー

画面上のルーラーオーバーレイ。ドラッグしてピクセル単位で距離を測定します。デザインのスペーシングを確認できます。

🖼ランダム画像

Canvas パターンを使用してカスタム寸法のランダムなプレースホルダー画像を生成します。PNG でダウンロード可能。

その他のカテゴリー

エージェントオプス (10)コード (39)システム管理 (9)生産性 (9)マーケティング (8)ビジネス (8)全105ツールを見る