デザインと色
ピッカー、パレット、グラデーション、コントラストチェッカー。
カラーピッカー＆コンバーター
色を選んで、HEX・RGB・HSL・OKLCH間で変換。
デザインと色
新着 カラーコントラストチェッカー
テキストと背景色のWCAG AA/AAAコントラスト比をチェック。
デザインと色
新着 CSSグラデーションジェネレーター
線形・放射・円錐のCSSグラデーションをライブプレビューで作成。
デザインと色
新着 CSS box-shadowジェネレーター
多層のCSS box-shadowをプリセットとライブプレビューで作成。CSS・値・Reactスタイルを即コピー。
デザインと色
新着 カラーパレットジェネレーター
補色・類似色・トライアド・モノクロームのパレットを生成。
デザインと色
新着 三次ベジェ曲線ジェネレーター
制御点をドラッグしてCSSのイージング曲線を設計。ライブプレビュー付き。
デザインと色
新着 角丸ジェネレーター
CSSの角丸や有機的なブロブ形状を視覚的に作成。
デザインと色
新着 CSS Flexboxプレイグラウンド
flexプロパティをライブプレビューで調整し、CSSをコピー。
デザインと色
新着 CSS Gridプレイグラウンド
gridの列・間隔・配置をライブプレビューで調整し、CSSを取得。
デザインと色
新着 グラスモーフィズムジェネレーター
すりガラス風のカードを設計してCSSをコピー。ライブプレビュー付き。
デザインと色
新着 CSS text-shadowジェネレーター
CSSのテキストシャドウをライブプレビューで調整し、コードをコピー。
デザインと色
新着 カラーミキサー
2色を任意の比率で混ぜ合わせ、結果や各段階の色をコピー。
デザインと色
新着 画像カラーピッカー
画像から好きな色を抽出し、主要なパレットをHEX・RGB・HSLで取得できます。
デザインと色
新着 Pixel Art Maker
Draw pixel art on a customizable grid, pick colors, and export as PNG — in your browser.
デザインと色
新着 Color Token Generator
Generate a full design-token scale (50–950 shades) from a single base color — CSS, Tailwind or JSON.
デザインと色