デザインツール
カラーパレット、タイポグラフィツール、スペーシング計算機、UIデザインユーティリティ。
Tailwind Color Reference
16進数とRGB値付きのすべてのTailwind CSSカラーパレットを参照します。
Spacing Scale Generator
デザインシステム用の一貫したスペーシングスケールを生成します。
Font Pairing Guide
見出しと本文テキストの調和したフォント組み合わせを見つけます。
Line Height Calculator
読みやすいタイポグラフィのための最適な行の高さを計算します。
Data URL Encoder
ファイルをbase64 Data URLに変換して、HTMLおよびCSSに埋め込みます。
ブレークポイントビジュアライザー
Tailwind、Bootstrap、カスタムフレームワークのCSSブレークポイントを視覚化します。
デザイントークンコンバーター
デザイントークンをJSON、CSS変数、SCSS形式に変換します。
ワイヤーフレームカラーパレット
ワイヤーフレームとプロトタイプ用のニュートラルカラーパレットを生成します。
CSSカーソルジェネレーター
全CSSカーソルタイプをライブプレビュー付きで確認しコードをコピーします。
アイコンサイズリファレンス
iOS、Android、Web、デスクトップアプリの標準アイコンサイズです。
CSSグリッドジェネレーター
CSSグリッドレイアウトを視覚的に構築してCSSコードをコピーします。
カラースキームジェネレーター
ベースカラーから補色、三角色、類似色スキームを生成します。
ボーダーラジウスビジュアライザー
CSSのborder-radius値をリアルタイムでプレビュー・比較します。
グラデーションメッシュ生成器
複数のカラーポイントで滑らかなCSSメッシュグラデーション背景を生成します。
不透明度ティント生成器
任意の色から不透明度バリエーションで完全なティントパレットを生成します。
文字間隔生成器
CSSのletter-spacingとword-spacingをプレビューして生成します。
アニメーションタイミング生成器
CSSアニメーションタイミング(cubic-bezier)生成器とビジュアルカーブプレビュー。
Z-Index マネージャー
CSSのz-indexスタッキングコンテキストビジュアライザー。
スクロールスナップジェネレーター
ライブプレビューとコピー対応コードでCSSスクロールスナッププロパティを生成します。
CSSクリップパスジェネレーター
ビジュアルエディターとライブプレビューでCSS clip-pathシェイプを作成します。
CSSフィルタージェネレーター
blur、brightness、contrastなどCSSフィルター効果をライブプレビューで調整してCSSをコピーします。
Flexboxジェネレーター
ビジュアルエディターとライブプレビューでCSSフレックスボックスのレイアウトコードを生成します。