メインコンテンツにスキップ
ToolShed
ホーム
人気
新着ツール
すべてのツール
読み込み中...
ホーム
デザイン・CSS
CSS calc()リファレンス
デザイン・CSS
無料
登録不要
CSS calc()リファレンス
CSS calc()関数の使用例を一覧表示する無料オンラインツール。
Item
Description
calc(100% - 20px)
幅から20px引いた値
calc(50vh + 10px)
ビューポート高の50%+10px
calc(100vw / 3)
ビューポート幅を3分割
calc(1em + 2px)
em + px 混在
calc(var(--x) * 2)
カスタム変数との組合せ
FAQ
よくある
質問
入力したデータはサーバーに送信されますか？
+
いいえ。CSS calc()リファレンスはすべての処理をお使いのブラウザ内で完結させます。入力内容がサーバーに送信されたり保存されたりすることはありません。
Tailwind CSSと併用できますか？
+
広告は表示されますか？
+
関連ツール
こちらも
おすすめ
CSS box-sizing
CSS box-sizingの値と挙動を一覧表示する無料オンラインツール。
CSS clamp()リファレンス
CSS clamp()関数の使用例を一覧表示する無料オンラインツール。
CSS env()リファレンス
CSS env()関数（セーフエリア変数）を一覧表示する無料オンラインツール。
CSS min()/max()
CSS min()/max()関数の使用例を一覧表示する無料オンラインツール。
border-radiusジェネレーター
CSSのborder-radiusをGUIで視覚的に調整。4隅個別・楕円形の角丸にも対応。コードをコピーしてすぐ使える無料オンラインツール。
Box Shadow生成
CSS box-shadowをGUIで直感的に作成。多重シャドウ、ニューモーフィズム、テキストシャドウにも対応。コード即コピーの無料ツール。
CSS calc Reference | Design & CSS | ToolShed | ToolShed