Visual CSS / devs tools

text-shadowレイヤーエディター

複数の文字影、文字色、背景色、フォント設定を組み合わせ、読みやすさを確認しながらCSSを作ります。

4 主な機能 English

編集画面を準備しています…

このツールの範囲

見た目だけで終わらない生成結果

見た目の設定だけでなく、状態、画面幅ごとの差、実装手順、注意点まで1つのProjectとして保存できます。

  • 複数text-shadow
  • 文字列を即時変更
  • font設定
  • contrast警告
出力形式

HTML · CSS · WordPress

Glossary

画面に出てくる英語の意味

Preview(プレビュー)
現在の設定を実際の見た目として確認する領域です。
State(ステート)
マウスを重ねた時、キーボードで選んだ時、押している時、無効時などの状態です。
Responsive(レスポンシブ)
画面や親要素の幅に合わせて、配置や見た目を調整する考え方です。
Reduced motion(動きを減らす設定)
アニメーションによる負担を減らすため、端末側で動きを少なくする利用者設定です。