ルビ（フリガナ）HTML自動生成ツール

漢字とふりがなを入力するだけでCSSルビ（タグ）のHTMLコードを自動生成。ruby-position・rub…

アスペクト比計算ツール

アスペクト比計算ツール。幅・高さから比率を自動算出し、比率から数値を逆算できます。プリセットやCSSコード出力…

CSS px・rem変換ツール

pxとremを瞬時に相互変換。基準フォントサイズを自由に変更しながら、CSS変数としてもコピーできる制作者向け…

流動レイアウト計算ツール

pxをレイアウト崩れなく%に変換。position: absoluteの配置もレスポンシブに対応できる計算ツー…

CSS Gridジェネレーター

行数・列数・gapを指定するだけでCSS Gridのレイアウトコードを自動生成できるジェネレーターです。

CSS Flexboxジェネレーター

FlexboxのプロパティをGUIで設定してCSSコードを自動生成。プリセット付きでレスポンシブ確認もできる直…

メタタグジェネレーター

タイトル・ディスクリプション・OGP・Robotsなど主要なメタタグをまとめて生成できるツールです。

CSSフィルタージェネレーター

CSS filterプロパティを視覚的に調整しながら、ホバーアニメーション対応のCSSコードをリアルタイム生成…

CSS Container Query ジェネレーター

CSSコンテナクエリ（@container）を視覚的にシミュレートし、実務で使えるHTML/CSSコードを自動…

CSS Clamp計算ジェネレーター

画面幅に合わせてフォントサイズや余白を滑らかに可変させるCSS clamp()関数の値を自動計算するツール。p…

CSSイージング関数ビジュアライザー

cubic-bezierをドラッグ操作で直感的に作成。ボタンホバーやカード浮上など実UIでプレビューしながらC…

CSSシャドウジェネレーター

box-shadow・drop-shadow・text-shadowをタブで切り替えてCSSコードを自動生成。…

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

背景色と文字色のコントラスト比を即時計算。WCAG 2.1のAA/AAA基準の合否をリアルタイム判定し、自動調…

CSS color-mix() ツール

2色と混合比率を指定してcolor-mix()の結果をリアルタイムでプレビュー。CSSコードをそのままコピーで…

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

2色以上のカラーノードをドラッグして作るCSSグラデーション生成ツール。線形・放射状・扇形、Oklab補間、テ…

カラースケール生成ツール

HEXカラーを入力するだけで、50〜950の11段階カラースケールとCSS変数コードを自動生成。アクセシビリテ…

画像カラーピッカー

画像から主要カラーを自動抽出してパレット化。使用割合の表示やスポイトでの色取得にも対応した無料ツール。

カラーコード一括変換ツール

複数のカラーコードをまとめて一括変換。HEX・RGB・HSL・HSV・CMYK・CSS変数形式に対応した変換ツ…

URLエンコード・デコードツール

URLエンコード・デコードを瞬時に変換。日本語URLや特殊文字、クエリパラメータの分解表示にも対応したツールで…

ダミーテキストジェネレーター

日本語・英語対応、用途別テンプレートで使えるダミーテキストを生成。文字数・件数指定、HTML出力にも対応。

全角・半角変換ツール

全角・半角変換ツールで、英数字・カタカナ・記号・スペースを個別に選んで一括変換。ブラウザ完結で安全に使えます。

HTML/CSS/JavaScript コード圧縮整形ツール

HTML・CSS・JavaScriptのコードをブラウザ上で圧縮・整形できる、Web制作者向けの無料ツールです…

Base64エンコード・デコードツール

テキスト・画像・SVGをBase64変換。HTML/CSS用コードもワンクリックで生成できます。

文字数カウントチェックツール

文字数・行数・バイト数・読了時間をリアルタイム表示。目標文字数の進捗バーやHTMLタグ除去など整形機能も搭載。…