• パーツ
  • ツール
  • ブログ

CSSテキストグラデーションツール

CSSテキストグラデーションツール

左下のカラーピッカーで選択した色をベースに右下のスライダーでHSLを変化させてグラデーションを生成しています。 ・カラーピッカー横のスライダーを変更するとグラデーションの開始位置、終了位置を調製できます。 ・<i class="fas fa-redo-alt"></i>:グラデーションの方向・角度を30度ずつ変更できます。 ・<i class="fas fa-random fa-fw"></i>:ランダムにグラデーションを生成します。 ・<i class="fas fa-code"></i>: 生成したlinear-gradientを表示します。 <p class="text-danger">テキストは「inline-block」にするなどインライン要素に設定することをオススメします。<br>ブロック要素だとグラデーションがテキストに上手く反映されないことがあります。</p>

詳細

Antonフォントで生成する「FIRST SLUM DUNK」風ロゴジェネレーター

Antonフォントで生成する「FIRST SLUM DUNK」風ロゴジェネレーター

Googleフォントの「Anton」を使用しCanvas要素にテキストを描画しています。 文字は自由に変更可能。右クリックで画像保存ができます。

詳細

テキストを下線マーカーで強調表示するCSS生成ツール

テキストを下線マーカーで強調表示するCSS生成ツール

カラー設定からマーカの色を変更できます。 「グラデーションにする」のチェックを付けるとマーカーを明度を変化させたグラデーションにします。 マーカのサイズはスライダーで調整可能です。

詳細

CSSグラデーションツール

CSSグラデーションツール

左下のカラーピッカーで選択した色をベースに右下のスライダーでHSLを変化させてグラデーションを生成しています。 ・カラーピッカー横のスライダーを変更するとグラデーションの開始位置、終了位置を調製できます。 ・<i class="fas fa-redo-alt"></i>:グラデーションの方向・角度を30度ずつ変更できます。 ・<i class="fas fa-random fa-fw"></i>:ランダムにグラデーションを生成します。 ・<i class="fas fa-code"></i>: 生成したlinear-gradientを表示します。

詳細

CSVファイルを読み込みHTMLのTableタグを生成するツール

CSVファイルを読み込みHTMLのTableタグを生成するツール

CSVファイルを選択するとHTMLのTableタグを生成します。クリップボードコピーも可能です。

詳細

画像→base64(Data-URL宣言付き)文字列変換ツール

画像→base64(Data-URL宣言付き)文字列変換ツール

ファイルを選択するとData-URL宣言付きのbase64文字列に変換した文字列をテキストエリアに表示します。 クリップボードのコピーも可能です

詳細

大文字小文字変換ツール

大文字小文字変換ツール

小文字を大文字に、大文字を小文字に変換するツールです。 ・上部のテキストに小文字を入れ「大文字に変換」ボタンをクリックすると大文字に変換されます。 ・下部のテキストに大文字を入れ「小文字に変換」ボタンをクリックすると小文字に変換されます。

詳細

文字数カウンターツール

文字数カウンターツール

テキストエリアに文字を入力すると文字数をカウントします。

詳細
Pa-Tuとは
運営者/お問い合わせ
利用規約
プライバシーポリシー
WEBパーツをCSSでカスタマイズしてコピペできる
© 2021 Copyright Pa-Tu