SheepDev

CSSグラデーション生成

CSSグラデーション生成では、角度と2色からlinear-gradient CSSを生成・previewします。

CSSグラデーション生成

⌂ 入力と結果はこのブラウザー内で処理され、自動保存・送信されません。

設定
入力待ち
● 自動プレビュー

入力・条件

出力

入力待ち

完全なテキスト結果

使い方

背景の色の変化を作るときは線形・放射状の方式と色停止点、角度などを指定します。プレビューを見ながら条件を一つずつ変えます。

CSSをコピーした後は実際の要素サイズでも確認してください。上に文字を載せる場合、背景の最も読みづらい位置でコントラストを確かめます。

例

#4F46E5
---
#22D3EE

原理・制限

入力は各欄1,048,576バイト、出力は33,554,432バイト、処理時間は5,000ミリ秒までです。入力を黙って切り詰めません。

使い方・解説

関連ツール

Web・UI・CSS

カラーコード変換

カラーコード変換では、HEX・RGB・HSL・alphaを変換して色をpreviewします。

Web・UI・CSS

コントラスト比

コントラスト比では、alpha合成後のcontrast比とWCAG判定を計算します。