UI Design Hub

UI・デザインツール

配色・CSS・レイアウトの作業を高速化。
すべてブラウザ内で完結し、データはサーバーに送信されません。

完全無料登録不要UI制作向け

CSSジェネレーター

スタイル調整とコード生成を同時に行えるツール。

🌈

テキスト・開発者向け

CSSグラデーションジェネレーター

CSSのlinear-gradient、radial-gradient、conic-gradientを視覚的に作成。リアルタイムプレビューでコードを即コピー。

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

CSSのbox-shadowを視覚的に作成。複数レイヤー対応、Material Design・Neumorphismプリセット付き。リアルタイムプレビューでコードを即コピー。

CSS整形・圧縮ツール

CSSコードを見やすく整形・圧縮。構文チェック付きでエラー箇所も表示。

HTML整形・圧縮ツール

HTMLコードを見やすく整形・圧縮。タグの閉じ忘れなどの構文チェック付き。

HTML整形

使ってみる→

カラー・ビジュアル

配色設計や画像からの色抽出に使えるツール。

🎨

テキスト・開発者向け

カラーコード変換

HEX・RGB・HSLカラーコードを相互変換。カラーピッカー付き。

画像カラーパレット抽出

写真から主要色を自動抽出し、HEXでコピーできる。

SNS用画像メーカー

InstagramやXなどのサイズに合わせて一括出力。

ダミーテキスト生成

日本語のダミーテキスト（Lorem Ipsum）を自動生成。Webデザインの仮文に。

ダミーテキストLorem Ipsum

使ってみる→