Knowledge

Font rasterization

Source 📝

255:
drawing a black (000000) letter on a white (FFFFFF) background, if a pixel ideally should be half filled (perhaps by a diagonal line from corner to corner) it is drawn 50% gray (BCBCBC). Over-simple application of this procedure can produce blurry glyphs. For example, if the letter includes a vertical line that should be one pixel wide but falls exactly between two pixels, it appears on screen as a two-pixel-wide gray line. This blurriness trades clarity for accuracy. However, modern systems often force lines to fall within integral pixel coordinates, which makes glyphs look sharper, but also makes lines slightly wider or thinner than they would have looked on a printed sheet of paper.
122: 218: 180:(and more popularly "black and white") rendering because no intermediate shades (of gray) are used to draw the glyphs. (In fact, any two colors can be used as foreground and background.) This form of rendering is also called aliased or "jagged". This is the fastest rendering method in the sense that it requires the least computational effort. However, it has the disadvantage that rendered glyphs may lose definition and become hard to recognize at small sizes. Therefore, many font data files (such as TrueType) contain 242: 230: 206: 1509: 25: 335:'s intent of hinting and closer to the original outline. The result is that the on-screen display looks extremely similar to printed output, but can occasionally be difficult to read at smaller point sizes. The Quartz renderer has, since macOS Mojave, removed subpixel rendering, relying purely on greyscale anti-aliasing instead. This change is acceptable to HiDPI "retina" screens, but makes text on external monitors harder to read. 259: 266:
Most computer displays have pixels made up of multiple subpixels (typically one each for red, green, and blue, which are combined to produce the full range of colours). In some cases, particularly with flat panel displays, it is possible to exploit this by rendering at the subpixel resolution rather
254:
A more complicated approach is to use standard anti-aliasing techniques from computer graphics. This can be thought of as determining, for each pixel at the edges of the character, how much of that pixel the character occupies, and drawing that pixel with that degree of opacity. For example, when
342:
library, which depending on the settings, can fall anywhere between Microsoft's and Apple's implementations; it supports hinting and anti-aliasing, and optionally performs subpixel rendering and positioning. FreeType also offers some features not present in either implementation such as
317:'s intent of the gasp table, it becomes easier to read on the screen, but may appear somewhat different when printed. This has changed with Direct2D/DirectWrite shipping on Windows 7 and Windows Vista platform update, allowing subpixel text positioning to 1/16 pixel sizes. 184:
that help the rasterizer decide where to render pixels for particularly troublesome areas in the glyphs, or sets of hand-tweaked bitmaps to use at specific pixel sizes. As a prototypical example, all versions of
295:, or may be added later. In principle, each application may use a different font rasterization library, but in practice most systems attempt to standardize on a single library. 327:
is distinguished by the use of subpixel positioning; it does not force glyphs into exact pixel locations, instead using various antialiasing techniques, including
125:
Especially for small font sizes, rendering of vectorized fonts in "thumbnail" view can vary significantly with thumbnail size. Here, a small change in the
1094: 1468: 354:) occasionally use their own font renderer. Video games and other 3D applications may also need faster, GPU-based renderers such as various 137:
results in significant and mutually distinct rendering anomalies, possibly due to rounding errors resulting from use of integer font sizes.
176:
The simplest form of rasterization is simple line-drawing with no anti-aliasing of any kind. In Microsoft's terminology, this is called
382: 89: 235:
Rasterization with anti-aliasing with hinting. Here pixels are forced to fall into integral pixel coordinates whenever possible.
61: 538: 68: 42: 108: 75: 511: 397: 267:
than using whole pixels, which can increase the effective resolution of the screen. This is generally known as
305:. On the other hand, the standard Microsoft rasterizer without ClearType is an example of one that prioritizes 57: 46: 1463: 1348: 1310: 121: 456: 1533: 1494: 563: 168:—information embedded in the font data that optimizes rendering details for particular character sizes. 1074: 506: 720: 420: 1478: 1295: 966: 903: 608: 531: 355: 262:
Detail of subpixel rendering, showing positions of individual color pixels that make up white font
324: 35: 501: 82: 923: 646: 217: 439:"MacOS Mojave removes subpixel anti-aliasing, making non-retina displays blurry | Hacker News" 313:'s intent of hinting, and even not antialiasing certain fonts at certain sizes, following the 1398: 898: 893: 806: 793: 626: 161: 1190: 831: 685: 347: 8: 1512: 1473: 1386: 1280: 1135: 1113: 1103: 971: 578: 568: 524: 408: 346:
Applications may also bring their own font rendering solutions. Graphics frameworks like
292: 309:'s intent of clarity; by forcing text into integral coordinate positions, following the 1436: 1363: 1333: 1305: 1275: 1235: 862: 725: 710: 651: 641: 328: 268: 1358: 1381: 1300: 1255: 1185: 656: 298: 186: 1267: 1220: 1059: 1006: 867: 677: 288: 1403: 1290: 1285: 1205: 1173: 1064: 801: 603: 378: 153: 145: 438: 1408: 1353: 1230: 1033: 857: 811: 745: 715: 583: 284: 247:
Rasterization with hinting and subpixel rendering for an RGB flat panel display
1527: 1200: 1168: 1158: 1038: 498:– Beat Stamm's online book about rasterization, with an emphasis on ClearType 351: 332: 314: 310: 306: 241: 229: 149: 164:
on screen text to make it smoother and easier to read. It may also involve
1458: 1338: 1225: 1210: 1180: 1140: 1123: 877: 847: 821: 730: 573: 555: 165: 457:"On slight hinting, proper text rendering, stem darkening and LCD filters" 287:
common to many applications. Such a shared library may be built into the
1453: 1448: 1441: 1431: 1245: 1195: 1150: 1090: 1054: 1025: 1013: 993: 816: 768: 636: 409:
MSDN Library : .NET Development : WPF : ClearType Overview
258: 194: 502:
CS 354 Computer Graphics — path rendering; University of Texas at Austin
1426: 1240: 1130: 983: 976: 953: 908: 872: 826: 783: 778: 773: 758: 598: 593: 588: 547: 302: 205: 190: 271:. One proprietary implementation of subpixel rendering is Microsoft's 918: 913: 690: 618: 283:
In modern operating systems, rasterization is normally provided by a
272: 24: 1391: 1250: 1069: 942: 928: 753: 705: 339: 320: 1215: 1001: 852: 763: 695: 631: 181: 1118: 735: 495: 157: 331:, to position characters and lines to appear further from the 961: 700: 668: 516: 1317: 1163: 1108: 474: 343:
color-balanced subpixel rendering and gamma correction.
278: 421:"[ft] Fwd: Re: Texts Rasterization Exposures" 398:
About Text Rendering in Windows Internet Explorer 9
49:. Unsourced material may be challenged and removed. 197:) only provided this type of built-in rasterizer. 1525: 223:Rasterization with anti-aliasing without hinting 148:description (as found in scalable fonts such as 16:Process of converting text from vector to raster 496:The Raster Tragedy at Low-Resolution Revisited 1469:Intellectual property protection of typefaces 532: 383:Engineering Changes to ClearType in Windows 7 1011: 539: 525: 211:Simple rasterization without anti-aliasing 1495:Punctuation and other typographic symbols 171: 144:is the process of converting text from a 109:Learn how and when to remove this message 257: 120: 301:has supported subpixel rendering since 160:description. This often involves some 1526: 373: 371: 520: 512:The Ails Of Typographic Anti-Aliasing 393: 391: 377:Greg Hitchcock (with introduction by 279:Currently used rasterization systems 47:adding citations to reliable sources 18: 368: 13: 388: 14: 1545: 489: 1508: 1507: 240: 228: 216: 204: 23: 34:needs additional citations for 546: 467: 449: 431: 413: 402: 1: 1464:History of Western typography 507:Texts Rasterization Exposures 475:"Slug Font Rendering Library" 361: 358:-based renderers and "Slug". 1311:traditional point-size names 7: 564:Canons of page construction 338:Most other systems use the 10: 1550: 385:", MSDN blogs, 23 Jun 2009 1503: 1487: 1419: 1372: 1326: 1266: 1149: 1089: 1047: 1024: 992: 952: 941: 886: 840: 792: 744: 721:Subscript and superscript 676: 667: 617: 554: 1479:Vox-ATypI classification 609:Intentionally blank page 1012: 263: 172:Types of rasterization 138: 261: 124: 1349:Typographic features 443:news.ycombinator.com 348:Skia Graphics Engine 58:"Font rasterization" 43:improve this article 1474:Technical lettering 1373:Typography in other 1114:Hanging punctuation 293:desktop environment 1534:Digital typography 1437:Handwriting script 1364:Desktop publishing 1334:Character encoding 1327:Digital typography 841:Horizontal aspects 794:Visual distinction 652:Widows and orphans 329:subpixel rendering 269:subpixel rendering 264: 142:Font rasterization 139: 1521: 1520: 1268:Typographic units 1186:For position only 1085: 1084: 937: 936: 299:Microsoft Windows 187:Microsoft Windows 119: 118: 111: 93: 1541: 1511: 1510: 1488:Related template 1420:Related articles 1221:Phototypesetting 1075:reverse-contrast 1060:Display typeface 1017: 994:Blackletter type 950: 949: 887:Vertical aspects 868:Sentence spacing 678:Typeface anatomy 674: 673: 541: 534: 527: 518: 517: 483: 482: 471: 465: 464: 453: 447: 446: 435: 429: 428: 417: 411: 406: 400: 395: 386: 375: 289:operating system 244: 232: 220: 208: 136: 132: 129:multiplier from 128: 114: 107: 103: 100: 94: 92: 51: 27: 19: 1549: 1548: 1544: 1543: 1542: 1540: 1539: 1538: 1524: 1523: 1522: 1517: 1499: 1483: 1415: 1375:writing systems 1374: 1368: 1322: 1262: 1206:Microtypography 1145: 1081: 1043: 1020: 988: 945:classifications 944: 933: 882: 836: 802:Blackboard bold 788: 740: 663: 613: 604:Recto and verso 550: 545: 492: 487: 486: 479:sluglibrary.com 473: 472: 468: 455: 454: 450: 437: 436: 432: 419: 418: 414: 407: 403: 396: 389: 379:Steven Sinofsky 376: 369: 364: 281: 252: 251: 250: 249: 248: 245: 237: 236: 233: 225: 224: 221: 213: 212: 209: 174: 134: 130: 126: 115: 104: 98: 95: 52: 50: 40: 28: 17: 12: 11: 5: 1547: 1537: 1536: 1519: 1518: 1516: 1515: 1504: 1501: 1500: 1498: 1497: 1491: 1489: 1485: 1484: 1482: 1481: 1476: 1471: 1466: 1461: 1456: 1451: 1446: 1445: 1444: 1439: 1434: 1423: 1421: 1417: 1416: 1414: 1413: 1412: 1411: 1409:National Fonts 1401: 1396: 1395: 1394: 1384: 1378: 1376: 1370: 1369: 1367: 1366: 1361: 1356: 1354:Web typography 1351: 1346: 1341: 1336: 1330: 1328: 1324: 1323: 1321: 1320: 1315: 1314: 1313: 1303: 1298: 1293: 1288: 1283: 1278: 1272: 1270: 1264: 1263: 1261: 1260: 1259: 1258: 1248: 1243: 1238: 1233: 1231:Reversing type 1228: 1223: 1218: 1213: 1208: 1203: 1198: 1193: 1188: 1183: 1178: 1177: 1176: 1171: 1161: 1155: 1153: 1147: 1146: 1144: 1143: 1138: 1133: 1128: 1127: 1126: 1116: 1111: 1106: 1100: 1098: 1087: 1086: 1083: 1082: 1080: 1079: 1078: 1077: 1072: 1067: 1057: 1051: 1049: 1045: 1044: 1042: 1041: 1036: 1030: 1028: 1022: 1021: 1019: 1018: 1009: 1004: 998: 996: 990: 989: 987: 986: 981: 980: 979: 974: 969: 958: 956: 947: 939: 938: 935: 934: 932: 931: 926: 921: 916: 911: 906: 901: 896: 890: 888: 884: 883: 881: 880: 875: 870: 865: 860: 858:Letter-spacing 855: 850: 844: 842: 838: 837: 835: 834: 829: 824: 819: 814: 812:Color printing 809: 804: 798: 796: 790: 789: 787: 786: 781: 776: 771: 766: 761: 756: 750: 748: 746:Capitalization 742: 741: 739: 738: 733: 728: 723: 718: 713: 708: 703: 698: 693: 688: 682: 680: 671: 665: 664: 662: 661: 660: 659: 649: 644: 639: 634: 629: 623: 621: 615: 614: 612: 611: 606: 601: 596: 591: 586: 584:Page numbering 581: 576: 571: 566: 560: 558: 552: 551: 544: 543: 536: 529: 521: 515: 514: 509: 504: 499: 491: 490:External links 488: 485: 484: 466: 448: 430: 412: 401: 387: 366: 365: 363: 360: 285:shared library 280: 277: 246: 239: 238: 234: 227: 226: 222: 215: 214: 210: 203: 202: 201: 200: 199: 173: 170: 150:TrueType fonts 117: 116: 31: 29: 22: 15: 9: 6: 4: 3: 2: 1546: 1535: 1532: 1531: 1529: 1514: 1506: 1505: 1502: 1496: 1493: 1492: 1490: 1486: 1480: 1477: 1475: 1472: 1470: 1467: 1465: 1462: 1460: 1457: 1455: 1452: 1450: 1447: 1443: 1440: 1438: 1435: 1433: 1430: 1429: 1428: 1425: 1424: 1422: 1418: 1410: 1407: 1406: 1405: 1402: 1400: 1397: 1393: 1390: 1389: 1388: 1385: 1383: 1380: 1379: 1377: 1371: 1365: 1362: 1360: 1359:Bézier curves 1357: 1355: 1352: 1350: 1347: 1345: 1344:Rasterization 1342: 1340: 1337: 1335: 1332: 1331: 1329: 1325: 1319: 1316: 1312: 1309: 1308: 1307: 1304: 1302: 1299: 1297: 1294: 1292: 1289: 1287: 1284: 1282: 1279: 1277: 1274: 1273: 1271: 1269: 1265: 1257: 1254: 1253: 1252: 1249: 1247: 1244: 1242: 1239: 1237: 1234: 1232: 1229: 1227: 1224: 1222: 1219: 1217: 1214: 1212: 1209: 1207: 1204: 1202: 1201:Microprinting 1199: 1197: 1194: 1192: 1189: 1187: 1184: 1182: 1179: 1175: 1172: 1170: 1167: 1166: 1165: 1162: 1160: 1159:Etaoin shrdlu 1157: 1156: 1154: 1152: 1148: 1142: 1139: 1137: 1134: 1132: 1129: 1125: 1122: 1121: 1120: 1117: 1115: 1112: 1110: 1107: 1105: 1102: 1101: 1099: 1096: 1092: 1088: 1076: 1073: 1071: 1068: 1066: 1063: 1062: 1061: 1058: 1056: 1053: 1052: 1050: 1046: 1040: 1037: 1035: 1032: 1031: 1029: 1027: 1023: 1016: 1015: 1010: 1008: 1005: 1003: 1000: 999: 997: 995: 991: 985: 982: 978: 975: 973: 970: 968: 965: 964: 963: 960: 959: 957: 955: 951: 948: 946: 940: 930: 927: 925: 922: 920: 917: 915: 912: 910: 907: 905: 902: 900: 897: 895: 892: 891: 889: 885: 879: 876: 874: 871: 869: 866: 864: 861: 859: 856: 854: 851: 849: 846: 845: 843: 839: 833: 830: 828: 825: 823: 820: 818: 815: 813: 810: 808: 805: 803: 800: 799: 797: 795: 791: 785: 782: 780: 777: 775: 772: 770: 767: 765: 762: 760: 757: 755: 752: 751: 749: 747: 743: 737: 734: 732: 729: 727: 724: 722: 719: 717: 714: 712: 709: 707: 704: 702: 699: 697: 694: 692: 689: 687: 684: 683: 681: 679: 675: 672: 670: 666: 658: 655: 654: 653: 650: 648: 645: 643: 640: 638: 635: 633: 630: 628: 625: 624: 622: 620: 616: 610: 607: 605: 602: 600: 597: 595: 592: 590: 587: 585: 582: 580: 577: 575: 572: 570: 567: 565: 562: 561: 559: 557: 553: 549: 542: 537: 535: 530: 528: 523: 522: 519: 513: 510: 508: 505: 503: 500: 497: 494: 493: 480: 476: 470: 462: 458: 452: 444: 440: 434: 426: 425:lists.gnu.org 422: 416: 410: 405: 399: 394: 392: 384: 380: 374: 372: 367: 359: 357: 353: 352:Google Chrome 349: 344: 341: 336: 334: 333:type designer 330: 326: 322: 318: 316: 315:type designer 312: 311:type designer 308: 307:type designer 304: 300: 296: 294: 290: 286: 276: 274: 270: 260: 256: 243: 231: 219: 207: 198: 196: 192: 188: 183: 179: 169: 167: 163: 162:anti-aliasing 159: 155: 151: 147: 143: 123: 113: 110: 102: 99:November 2009 91: 88: 84: 81: 77: 74: 70: 67: 63: 60: –  59: 55: 54:Find sources: 48: 44: 38: 37: 32:This article 30: 26: 21: 20: 1459:Type foundry 1343: 1296:Metric units 1226:Punchcutting 1211:Movable type 1181:Font catalog 1141:Vertical bar 878:Word spacing 848:Figure space 731:Text figures 574:Even working 478: 469: 461:freetype.org 460: 451: 442: 433: 424: 415: 404: 345: 337: 319: 297: 282: 265: 253: 177: 175: 141: 140: 105: 96: 86: 79: 72: 65: 53: 41:Please help 36:verification 33: 1454:Type design 1449:Style guide 1442:Calligraphy 1432:Handwriting 1246:Type design 1196:Lorem ipsum 1191:Letterpress 1151:Typesetting 1091:Punctuation 1055:Record type 1026:Gaelic type 1014:Schwabacher 904:Body height 769:Letter case 637:Line length 195:Windows 3.1 1427:Penmanship 1399:East Asian 1241:Type color 1174:monospaced 1131:Interpunct 1124:minus sign 1048:Specialist 984:Sans-serif 977:slab serif 954:Roman type 909:Cap height 873:Thin space 832:Whitespace 784:Title case 779:Snake case 774:Small caps 759:Camel case 691:Diacritics 599:Pull quote 594:Pagination 589:Paper size 548:Typography 362:References 303:Windows XP 191:Windows 95 69:newspapers 924:Overshoot 919:Mean line 914:Descender 827:Underline 669:Character 647:Runaround 627:Alignment 619:Paragraph 350:(used by 273:ClearType 189:prior to 1528:Category 1513:Category 1392:PT Fonts 1387:Cyrillic 1251:Typeface 1169:computer 1070:fat face 943:Typeface 929:x-height 899:Baseline 894:Ascender 754:All caps 716:Rotation 711:Ligature 706:Ink trap 340:FreeType 321:Mac OS X 178:bi-level 127:upright= 1339:Hinting 1216:Pangram 1034:Insular 1007:Rotunda 1002:Fraktur 967:Antiqua 853:Kerning 822:Oblique 817:Italics 764:Initial 696:Dingbat 686:Counter 632:Leading 291:or the 166:hinting 152:) to a 83:scholar 1382:Arabic 1281:Cicero 1119:Hyphen 1104:Bullet 1065:script 1039:Uncial 972:Didone 736:Tittle 579:Margin 569:Column 325:Quartz 193:(e.g. 158:bitmap 154:raster 146:vector 85:  78:  71:  64:  56:  1306:Point 1276:Agate 1136:Space 962:Serif 863:Pitch 726:Swash 701:Glyph 642:River 182:hints 90:JSTOR 76:books 1404:Thai 1318:Twip 1301:Pica 1256:list 1236:Sort 1164:Font 1109:Dash 1095:List 807:Bold 657:runt 556:Page 135:1.75 131:1.70 62:news 381:) " 356:SDF 323:'s 156:or 133:to 45:by 1530:: 1291:En 1286:Em 477:. 459:. 441:. 423:. 390:^ 370:^ 275:. 1097:) 1093:( 540:e 533:t 526:v 481:. 463:. 445:. 427:. 112:) 106:( 101:) 97:( 87:· 80:· 73:· 66:· 39:.

Index


verification
improve this article
adding citations to reliable sources
"Font rasterization"
news
newspapers
books
scholar
JSTOR
Learn how and when to remove this message

vector
TrueType fonts
raster
bitmap
anti-aliasing
hinting
hints
Microsoft Windows
Windows 95
Windows 3.1





subpixel rendering
ClearType
shared library

Text is available under the Creative Commons Attribution-ShareAlike License. Additional terms may apply.