背景のぼかし(backdrop-filter)、透明度、境界線効果をリアルタイムに調整できるモダンなすりガラスUI作成ツール。
背面コンテンツをぼかすフィルター強度を指定します。
ガラスパネルの半透明背景の濃度を設定します。
ガラスのエッジを際立たせる境界線の輝度と透明度を指定します。
Safari環境向けに-webkit-backdrop-filterプレフィックスを必ず付与し、非対応ブラウザ向けの代替背景色も設定してください。
背面コンテンツの要素が存在するか確認し、親要素にoverflow: hiddenなどのクリッピングが適用されていないか検証してください。
Chrome、Firefox、Safari、Edgeなどの最新ブラウザで標準対応しています。
標準アスペクト比(16:9、4:3、21:9など)の計算と、最適な解像度やレスポンシブサイズの算出を瞬時に行います。
16x16、32x32、180x180のファビコン画像、manifest.json、HTMLリンクタグを一括生成。
Convert colors between HEX, RGB, HSL, HSV, and CMYK formats instantly with visual color picker, shades, and contrast checks.
Test text and background color pairs against WCAG 2.1 AA and AAA accessibility standards with real-time contrast ratio score.
Preview harmonious Google Fonts combinations for headings and body copy with live editorial sample layouts.
Generate clean, pixel-perfect CSS triangles pointing in any direction using the border trick with one-click CSS copy.