{"id":326,"date":"2021-08-14T17:38:41","date_gmt":"2021-08-15T00:38:41","guid":{"rendered":"https:\/\/devblogs.microsoft.com\/math-in-office\/?p=326"},"modified":"2021-08-14T17:38:41","modified_gmt":"2021-08-15T00:38:41","slug":"cascadia-code-font","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/math-in-office\/cascadia-code-font\/","title":{"rendered":"Cascadia Code Font"},"content":{"rendered":"

For many years, I\u2019ve wanted to use real mathematical notation in computer programs for code that is mathematical in nature. The document UnicodeMath<\/a> discusses this in some detail in Section 6. Using UnicodeMath in Programming Languages<\/em>. Over the years, some advances beyond ASCII (invented in the 1960\u2019s!) have been made. For example, you can<\/em> use Unicode math alphabetics<\/a> as variable names in the C++ compilers for the major platforms. In math documents, the index for a summation is often a math-italic letter such as \ud835\udc56, \ud835\udc57, \ud835\udc58, \ud835\udc59, \ud835\udc5a or \ud835\udc5b. You can use these math-italic characters in your C++ programs! In fact, an \ud835\udc5b (U+1D45B) for-loop index has been shipping for several years in RichEdit C++ code running on iOS, Mac, Android, and Windows. Unicode also has myriad mathematical symbols, including the very common \u2260, \u2264, and \u2265. Wouldn\u2019t it be nice to see those mathematical symbols instead of the 1960\u2019s !=, <=, and >= ?! Well, you can see them by switching your font. The resulting math spacing<\/a> isn\u2019t perfect since it needs to maintain fixed-width character spacing, but the code is easier to read. This post describes one such font, Cascadia Code PL, which I use in Microsoft Visual Studio and in the Microsoft CodeFlow code-review program. \u00a0Other fonts with similar capability are described in 5 monospaced fonts with cool coding ligatures | Better Web Type<\/a>.<\/p>\n

The Cascadia Code font<\/a> is an open-source font developed to improve the readability of program text in plain-text editors such as in the Windows Terminal, Microsoft Visual Studio, and Visual Studio Code. A major restriction in these contexts is fixed-width character spacing. So, in displaying \u201c<=\u201d as \u2018\u2264\u2019, some extra leading and trailing space is added, and the glyph is widened. The font also works as designed in Notepad. It uses 104 ligatures as well as extendable glyph sequences to render character combinations such as shown in the table<\/p>\n\n\n\n\n\n\n\n\n\n\n\n
characters<\/strong><\/td>\ndisplay<\/strong><\/td>\nmechanism<\/strong><\/td>\n<\/tr>\n
<=<\/td>\n\u2264<\/td>\nligature<\/td>\n<\/tr>\n
>=<\/td>\n\u2265<\/td>\nligature<\/td>\n<\/tr>\n
!=<\/td>\n\u2260<\/td>\nligature<\/td>\n<\/tr>\n
==><\/td>\n\u21d2<\/td>\nsequence<\/td>\n<\/tr>\n
<==<\/td>\n\u21d0<\/td>\nsequence<\/td>\n<\/tr>\n
===><\/td>\n\u27f9<\/td>\nsequence<\/td>\n<\/tr>\n
<===<\/td>\n\u27fa<\/td>\nsequence<\/td>\n<\/tr>\n
:=<\/td>\n\u2254<\/td>\nligature<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

When you concatenate many equal signs together, you see a continuous horizontal double bar, which is a great way to divide up sections of code. And you can insert \u2018<\u2019 and \u2018>\u2019 along the way to make super long arrows with or without tails.<\/p>\n

Let\u2019s examine how Cascadia Code displays \u201c<=\u201d as \u2018\u2264\u2019. Consider the string \u201ca<b<=c=d\u201d. It is rendered using the glyphs<\/p>\n\n\n\n\n
a<\/td>\n<<\/td>\nb<\/td>\n\u2264<\/td>\n<\/td>\nc<\/td>\n=<\/td>\nd<\/td>\n<\/tr>\n
00e1<\/td>\n0809<\/td>\n00fc<\/td>\n0a72<\/td>\n0c2d<\/td>\n00fd<\/td>\n0806<\/td>\n0103<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

Here the glyph 0a72 is named less_equal.liga and is the complete \u2264 ligature. The glyph 0c2d is named LIG and has no ink. LIG is included to preserve the two-character advance width and the two-character count. Many other glyph pairs have LIG as the second \u201cglyph\u201d. The advance widths and left side bearings of the symbols are<\/p>\n\n\n\n\n\n\n\n
glyph ID<\/strong><\/td>\nadvance width<\/strong><\/td>\nleft side bearing<\/strong><\/td>\nname<\/strong><\/td>\ncomment<\/strong><\/td>\n<\/tr>\n
0806<\/td>\n1200<\/td>\n100<\/td>\nequal<\/td>\n<\/td>\n<\/tr>\n
0809<\/td>\n1200<\/td>\n\u00a0\u00a096<\/td>\nless<\/td>\n<\/td>\n<\/tr>\n
0a72<\/td>\n1200<\/td>\n506<\/td>\nless_equal.liga<\/td>\nlarge left side bearing<\/td>\n<\/tr>\n
0c2d<\/td>\n1200<\/td>\n\u00a0\u00a0\u00a0\u00a00<\/td>\nLIG<\/td>\n0 left side bearing<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

The sequence ==> is displayed as \u21d2 by the glyph sequence 0a93 0a91 0a99, where 0a93 starts the horizontal double bar, 0a91 continues it and 0a93 finishes it with an arrowhead.<\/p>\n

Cascadia Code PL includes italic, variable-font weights from 200 to 700, Hebrew, Arabic, braille cells, line drawing characters, and lots more cool transformations<\/a>. If the font isn\u2019t installed on your computer, you can download it from here<\/a>. Happy programming!<\/p>\n","protected":false},"excerpt":{"rendered":"

For many years, I\u2019ve wanted to use real mathematical notation in computer programs for code that is mathematical in nature. The document UnicodeMath discusses this in some detail in Section 6. Using UnicodeMath in Programming Languages. Over the years, some advances beyond ASCII (invented in the 1960\u2019s!) have been made. For example, you can use […]<\/p>\n","protected":false},"author":40611,"featured_media":55,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-326","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-math-in-office"],"acf":[],"blog_post_summary":"

For many years, I\u2019ve wanted to use real mathematical notation in computer programs for code that is mathematical in nature. The document UnicodeMath discusses this in some detail in Section 6. Using UnicodeMath in Programming Languages. Over the years, some advances beyond ASCII (invented in the 1960\u2019s!) have been made. For example, you can use […]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/math-in-office\/wp-json\/wp\/v2\/posts\/326","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/math-in-office\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/math-in-office\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/math-in-office\/wp-json\/wp\/v2\/users\/40611"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/math-in-office\/wp-json\/wp\/v2\/comments?post=326"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/math-in-office\/wp-json\/wp\/v2\/posts\/326\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/math-in-office\/wp-json\/wp\/v2\/media\/55"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/math-in-office\/wp-json\/wp\/v2\/media?parent=326"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/math-in-office\/wp-json\/wp\/v2\/categories?post=326"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/math-in-office\/wp-json\/wp\/v2\/tags?post=326"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}