見出し画像

094 FigmaのVertical trim(上下トリミング)が惜しい感じ。2023/03/29

やはり日本語の文字って難しいというか、形式が違うというか。

今日は小さいけど大きなアプデがFigmaに入り、「Vertical trim(上下トリミング)」という機能が地味に細かい部分ですが地味に嬉しい!けど、惜しい感じなんです。

おそらく欧文フォントのベースラインを基準にしてるので、日本語フォントは割りかしはみ出ています。上下中央かもちょっと怪しい感じです。

ただ欧文フォントでも個性的な形のフォントは上手くトリミングされていないのもあったので(データの作り方とかあるのかもですね)、あまり過信せずにCSSで実装したらこうなるんだというぐらいな感じかもしれません。

ちなみにインスペクトはこんなコメントアウトとCSSが置いてありました。

/* leading-trim and text-edge are draft CSS properties.
Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
leading-trim: both;
text-edge: cap;

draft CSSと書いてあるのは草案のプロパティだそうで、まだ使えないようです。

今日の私のように(笑)こりゃいいわ!と変に多用せずに、ちゃんと使いどころを意識して使った方がよさそうだなと思いました。


最後まで読んで頂きありがとうございます。頂いたサポートは私の癒やし担当、愛猫シャーロックの胃袋にしっかりおさめます!