かんたんにフォントサイズ指定をプレビュー表示「フォントサイズシミュレーター」

概要​

フォントサイズシミュレーター
https://tools.desnote.com/fontsize/

CSSではフォントサイズの指定の仕方がたくさんあります。

px/em/rem/%/vw/vh/vmin/vmax

これってどれを指定すれば良いか理解してますか?

また、それぞれどんな挙動をするか把握してますか?

直感的に理解するために、フォントサイズのシミュレーターを作りました。

使い方マニュアル

プレビュー文字の入力

確認したい文字列を入力してください

それぞれの単位のスライダーを動かす

スライダーを動かすとフォントサイズが変化し、プレビューがそれに応じて変化します。

vminなどは、ブラウザのサイズを変えて確認してみてください。

それぞれの単位の説明を簡単に記載しています。

サンプル動画

 

 

フォントサイズシミュレーター
https://tools.desnote.com/fontsize/