<figure>
-
+
</figure>
<figcaption>Examples of the Old and Modern English alphabet.</figcaption>
In common typological classifications, linguists principally differentiate alphabets from other types of writing systems such as [syllabaries](https://en.wikipedia.org/wiki/Syllabary), where graphical units represent syllables, and logographies, where graphical units represent entire words (or other meaningful, decomposable units of language, called morphemes).
-In practice, however, writing systems frequently rely on more than one approach to represent language. For example, modern American English is written using both alphabetic letters and non-alphabetic symbols (e.g., 1, 2 , 3, @, &), many of which can be seen on standard computer keyboards.
+In practice, however, writing systems frequently rely on more than one approach to represent language. For example, modern American English is written using both alphabetic letters and non-alphabetic symbols (e.g., 1, 2 , 3, @, &), many of which can be seen on standard computer keyboards.
-CJK is the shorthand collective name for the Chinese, Japanese, and Korean writing systems, all of which include Chinese characters and derivatives. The “C” represents both the traditional version and simplified version of Chinese; the “J” represents Japanese Hiragana, Katakana, and Kanji (the latter being Chinese characters used in Japanese); and the “K” represents the Korean Hangeul and Hanja (the latter being Chinese characters used in Korean).
+CJK is the shorthand collective name for the Chinese, Japanese, and Korean [writing systems](/glossary/script_writing_system), all of which include Chinese [characters](/glossary/character) and derivatives. The “C” represents both the traditional version and simplified version of Chinese; the “J” represents Japanese Hiragana, Katakana, and Kanji (the latter being Chinese characters used in Japanese); and the “K” represents the Korean Hangeul and Hanja (the latter being Chinese characters used in Korean).
<figure>
</figure>
-These languages each have many thousands of characters and therefore their fonts also contain many glyphs (and Latin glyphs, too), which is why the individual writing systems—including the traditional and simplified versions of Chinese—are separated out into their own dedicated fonts, such as [Noto Sans Traditional Chinese](https://fonts.google.com/noto/specimen/Noto+Sans+TC). It’s unusual for a single CJK font to contain more than a single writing system.
\ No newline at end of file
+These languages each have many thousands of characters and therefore their [fonts](/glossary/font) also contain many [glyphs](/glossary/glyph) (and [Latin](/glossary/latin) glyphs, too), which is why the individual writing systems—including the traditional and simplified versions of Chinese—are separated out into their own dedicated fonts, such as [Noto Sans Traditional Chinese](https://fonts.google.com/noto/specimen/Noto+Sans+TC). It’s unusual for a single CJK font to contain more than a single writing system.
\ No newline at end of file
-Color fonts (also known as chromatic fonts) can use multiple colors in a single glyph, rather than a flat single color used by non-color (monochromatic) fonts. The default color values are also contained within the font file itself, although these can be overridden by the designer.
+Color [fonts](/glossary/font) (also known as chromatic fonts) can use multiple colors in a single [glyph](/glossary/glyph), rather than a flat single color used by non-color (monochromatic) fonts. The default color values are also contained within the font file itself, although these can be overridden by the designer.
<figure>
</figure>
-<figcaption>On the left, a regular, non-color font uses one color throughout; on the right, the same typeface, rendered as a color font, employs multiple colors.</figcaption>
-
-Google Fonts now supports a growing number of color fonts in its library, which can be found at https://fonts.google.com/?coloronly=true
+Google Fonts now supports a growing number of color fonts in its library. To narrow the library selection to color fonts, visit [fonts.google.com/?coloronly=true](https://fonts.google.com/?coloronly=true) or press the “Show only color fonts” toggle.
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 3130 1395" width="3130" height="1395">
- <defs>
- <radialGradient id="svg[326].g1" cx="277" cy="-196" r="475" gradientUnits="userSpaceOnUse">
- <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
- <stop offset="1" stop-color="#D22E1F"/>
- </radialGradient>
- <radialGradient id="svg[326].g2" cx="255" cy="-195" r="260" gradientUnits="userSpaceOnUse">
- <stop offset="0" stop-color="#0074B6"/>
- <stop offset="1" stop-color="#0074B6" stop-opacity="0.252"/>
- </radialGradient>
- <path d="M256,-199 Q284,-207 298,-222.5 Q312,-238 317,-255 Q322,-272 322,-284 Q322,-318 300,-338.5 Q278,-359 244,-359 Q221,-359 198,-345 Q175,-331 167,-331 Q154,-331 149,-336 L154,-344 Q156,-343 160,-343 Q174,-343 182,-357.5 Q190,-372 197,-380 Q224,-418 254,-418 Q288,-418 302,-383 L304,-385 Q294,-406 294,-431 Q294,-470 345,-521 Q350,-526 357.5,-533 Q365,-540 374,-548 L401,-574 Q419,-590 425,-603 Q407,-608 407,-622 Q407,-640 427,-640 Q446,-640 446,-621 Q446,-609 429,-583 Q416,-566 407.5,-552 Q399,-538 394,-528 Q348,-442 348,-327 Q348,-211 277,-196 Q348,-180 348,-65 Q348,50 394,136 Q399,146 407.5,160 Q416,174 429,191 Q446,217 446,229 Q446,248 427,248 Q407,248 407,230 Q407,215 425,211 Q419,198 401,182 L374,156 Q365,148 357.5,141 Q350,134 345,129 Q294,78 294,39 Q294,14 304,-7 L302,-9 Q288,26 254,26 Q224,26 197,-12 Q190,-20 182,-34.5 Q174,-49 160,-49 Q156,-49 154,-48 L149,-56 Q154,-61 167,-61 Q175,-61 198,-47 Q221,-33 244,-33 Q278,-33 300,-53.5 Q322,-74 322,-108 Q322,-120 317,-136.5 Q312,-153 298,-168 Q284,-183 256,-191 Z" id="svg[326].uniFD3E.0" fill="url(#svg[326].g1)"/>
- <path d="M217,-51 Q172,-93 172,-144 Q162,-132 141,-132 Q115,-132 96,-152 L77,-173 Q68,-184 59,-184 Q48,-184 43,-181 L39,-191 Q52,-198 68,-215 Q84,-234 100.5,-248 Q117,-262 141,-262 Q158,-262 172,-248 Q172,-298 217,-340 L225,-336 Q220,-321 220,-311 Q220,-277 260,-266 Q292,-257 292,-233 Q292,-219 279.5,-210.5 Q267,-202 256,-195 Q270,-187 281,-180 Q292,-173 292,-159 Q292,-134 260,-125 Q220,-114 220,-81 Q220,-70 225,-55 Z M184,-165 Q193,-183 215,-195 L215,-197 Q193,-209 184,-227 Q148,-220 148,-196 Q148,-173 184,-165 Z" id="svg[326].uniFD3E.1" fill="url(#svg[326].g2)"/>
- <linearGradient id="svg[284].g1" x1="37" y1="40" x2="-29.457" y2="-32.498" gradientUnits="userSpaceOnUse">
- <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
- <stop offset="1" stop-color="#D22E1F"/>
- </linearGradient>
- <path d="M79,-13 Q59,13 38.5,38.5 Q18,64 -3,90 L-74,24 L8,-79 Z" id="svg[284].glyph00490.0" fill="url(#svg[284].g1)"/>
- <linearGradient id="svg[306].g1" x1="172" y1="-500" x2="243.874" y2="-472.668" gradientUnits="userSpaceOnUse">
- <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
- <stop offset="1" stop-color="#D22E1F"/>
- </linearGradient>
- <linearGradient id="svg[306].g2" x1="27" y1="225" x2="183.383" y2="-109.821" gradientUnits="userSpaceOnUse">
- <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
- <stop offset="1" stop-color="#D22E1F"/>
- </linearGradient>
- <linearGradient id="svg[306].g3" x1="261" y1="-315" x2="182.349" y2="-422.523" gradientUnits="userSpaceOnUse">
- <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
- <stop offset="1" stop-color="#D22E1F"/>
- </linearGradient>
- <linearGradient id="svg[8].g1" x1="113" y1="-638" x2="136.061" y2="-260.004" gradientUnits="userSpaceOnUse">
- <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
- <stop offset="1" stop-color="#D22E1F"/>
- </linearGradient>
- <linearGradient id="svg[13].g1" x1="-92" y1="-17" x2="-59.148" y2="-21.978" gradientUnits="userSpaceOnUse">
- <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
- <stop offset="1" stop-color="#D22E1F"/>
- </linearGradient>
- <linearGradient id="svg[86].g1" x1="-5" y1="-69" x2="428.976" y2="-137.153" gradientUnits="userSpaceOnUse">
- <stop offset="0" stop-color="#D22E1F"/>
- <stop offset="1" stop-color="#D22E1F"/>
- </linearGradient>
- <path d="M242,-16 Q228,-16 215.5,-19 Q203,-22 203,-33 Q203,-39 204,-42 Q184,-34 145.5,-25 Q107,-16 67,-9.5 Q27,-3 0,0 L22,-132 Q207,-144 252,-169 Q281,-185 295,-218 Q298,-221 299,-221 Q300,-221 300,-216 Q300,-206 299,-204 Q295,-192 288,-174.5 Q281,-157 270,-133 L271,-132 Q304,-135 333,-141 Q376,-191 420.5,-239 Q465,-287 513,-332 Q526,-344 551,-354.5 Q576,-365 604,-365 Q633,-365 653.5,-344 Q674,-323 674,-295 Q674,-277 666,-262 Q641,-213 609.5,-174.5 Q578,-136 532,-107 Q507,-91 479,-77 Q451,-63 421,-52 Q405,-48 380.5,-41.5 Q356,-35 331,-29 Q306,-23 286,-20 Q274,-18 263,-17 Q252,-16 242,-16 Z M573,-213 Q573,-232 555.5,-243.5 Q538,-255 516,-255 Q509,-255 502,-254 Q495,-253 489,-249 Q454,-230 426.5,-202 Q399,-174 372,-147 Q425,-158 474.5,-170 Q524,-182 567,-203 Q573,-206 573,-213 Z" id="svg[86].glyph00116.0" fill="url(#svg[86].g1)"/>
- </defs>
- <g transform="translate(0, 1032)">
- <g transform="translate(0, 0)">
- <use xlink:href="#svg[326].uniFD3E.0"/>
- <use xlink:href="#svg[326].uniFD3E.1"/>
- </g>
- <g transform="translate(678, -756)">
- <use xlink:href="#svg[284].glyph00490.0"/>
- </g>
- <g transform="translate(485, 0)">
- <path d="M174,-488 L185,-588 Q212,-612 242,-612 Q268,-611 291,-606 Q314,-601 339,-595 L297,-465 Q270,-473 240,-479 Q210,-485 174,-488 Z" fill="url(#svg[306].g1)"/>
- <path d="M451,-455 Q432,-404 423,-380.5 Q414,-357 411,-349.5 Q408,-342 406,-338 Q398,-320 377.5,-301 Q357,-282 332.5,-263 Q308,-244 288,-227 Q274,-214 245.5,-189 Q217,-164 183.5,-131 Q150,-98 119,-61 Q88,-24 68.5,12 Q49,48 49,78 Q49,101 64,119 Q120,181 197.5,205 Q275,229 360,229 Q432,229 503.5,216.5 Q575,204 635,188 Q641,186 647,186 Q649,186 649,187 Q649,187 649,187 Q649,187 648,188 Q604,241 539,280.5 Q474,320 400.5,341.5 Q327,363 256,363 Q173,363 111.5,330 Q50,297 21,238 Q-8,179 4,102 Q19,9 52.5,-60.5 Q86,-130 132,-183.5 Q178,-237 231.5,-281 Q285,-325 341.5,-366.5 Q398,-408 451,-455 Z" fill="url(#svg[306].g2)"/>
- <path d="M407,-340 L218,-252 Q206,-261 195.5,-272 Q185,-283 176,-295 Q152,-325 141.5,-361.5 Q131,-398 131,-435 Q131,-482 145.5,-523 Q160,-564 185,-588 Q187,-526 192,-489 Q197,-452 210.5,-429 Q224,-406 248,-385 Q257,-376 268,-372.5 Q279,-369 291,-369 Q316,-369 345,-382 Q374,-395 402,-415 Q430,-435 452,-456 Z" fill="url(#svg[306].g3)"/>
- </g>
- <g transform="translate(1168, 0)">
- <path d="M73,-570 L136,-687 L174,-118 L112,0 Z" fill="url(#svg[8].g1)"/>
- </g>
- <g transform="translate(1429, 171)">
- <use xlink:href="#svg[284].glyph00490.0"/>
- </g>
- <g transform="translate(1280, 0)">
- <path d="M205,-24 Q201,-23 201.5,-29.5 Q202,-36 203,-41 Q180,-31 143,-23 Q106,-15 67.5,-9 Q29,-3 0,0 L21,-127 Q30,-128 58.5,-131 Q87,-134 123,-139 Q159,-144 192.5,-150.5 Q226,-157 246,-166 Q265,-174 277.5,-189.5 Q290,-205 295,-218 Q299,-226 300,-216.5 Q301,-207 299,-205 Q292,-182 279.5,-149.5 Q267,-117 249,-84 Q231,-51 206,-24 Z" fill="url(#svg[13].g1)"/>
- </g>
- <g transform="translate(1478, -22)">
- <use xlink:href="#svg[86].glyph00116.0"/>
- </g>
- <g transform="translate(2199, 0)">
- <use xlink:href="#svg[326].uniFD3E.0" x="485" y="-392" transform="matrix(-1 0 0 -1 970 -784)"/>
- <use xlink:href="#svg[326].uniFD3E.1" x="485" y="-392" transform="matrix(-1 0 0 -1 970 -784)"/>
- </g>
- </g>
-</svg>
+<svg width="1920" height="1080" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="m176.989 416.976-63.995 36.77L49 416.976l63.994-36.77 63.995 36.77Zm127.253-51.479c-12.75-7.354-27.707-6.128-44.87 3.677l-19.125 11.032c-11.278 6.373-21.699 15.811-31.261 28.313-9.562 12.502-17.286 25.984-23.17 40.447-5.885 14.463-8.827 28.313-8.827 41.55l-63.995-36.77c0-13.237 2.943-27.087 8.827-41.55 5.885-14.463 13.731-27.946 23.538-40.448 9.808-12.502 20.351-21.939 31.63-28.313l18.389-11.031c17.163-9.805 32.12-11.031 44.869-3.677l63.995 36.77Zm-191.248 88.249v397.12L49 814.095V416.976l63.994 36.77Zm337.626-172.82c-12.75-7.354-27.707-6.129-44.87 3.677l-19.125 11.031c-11.278 6.373-21.699 15.811-31.261 28.313-9.563 12.502-17.286 25.984-23.171 40.447-5.884 14.463-8.826 28.313-8.826 41.551l-63.995-36.771c0-13.237 2.942-27.087 8.827-41.55 5.885-14.463 13.731-27.945 23.538-40.447 9.808-12.502 20.351-21.94 31.63-28.314l19.124-11.031c16.673-9.805 31.385-11.031 44.134-3.677l63.995 36.771ZM259.372 442.715v323.579l-63.994-36.77V405.945l63.994 36.77Zm146.378-84.572v323.579l-63.259-36.77V321.373l63.259 36.77Zm-292.756 95.603 63.995-36.77v73.54c0-13.237 2.942-27.087 8.827-41.55 5.884-14.463 13.608-27.945 23.17-40.447 9.562-12.502 19.983-21.94 31.261-28.313l19.125-11.032c17.163-9.805 32.12-11.031 44.87-3.677 12.75 7.354 19.125 20.837 19.125 40.448 0-13.238 2.942-27.088 8.826-41.551 5.885-14.463 13.608-27.945 23.171-40.447 9.562-12.502 19.983-21.94 31.261-28.313l19.125-11.031c17.163-9.806 32.12-11.031 44.87-3.677 12.75 7.354 19.124 20.836 19.124 40.447v323.579l-63.994 36.77V358.143l-82.383 47.802v323.579l-63.995 36.77V442.715l-82.383 47.801v323.579l-63.995 36.771v-397.12Z" fill="#FFD215"/><path d="M405.751 358.143v323.579l-63.259-36.77V321.373l63.259 36.77Z" fill="url(#b)"/><path d="M259.371 442.715v323.579l-63.994-36.77V405.945l63.994 36.77Z" fill="url(#c)"/><path d="M450.621 280.926c-12.75-7.354-27.707-6.129-44.87 3.677l-19.125 11.031c-11.279 6.373-21.699 15.811-31.261 28.313-9.563 12.502-17.286 25.984-23.171 40.447-5.884 14.463-8.827 28.313-8.827 41.551l-63.994-36.771c0-13.237 2.942-27.087 8.827-41.55 5.884-14.463 13.73-27.945 23.538-40.447 9.808-12.502 20.351-21.94 31.629-28.314l19.125-11.031c16.673-9.805 31.384-11.031 44.134-3.677l63.995 36.771Z" fill="url(#d)"/><path d="M112.994 453.746v397.12L49 814.096v-397.12l63.994 36.77Z" fill="url(#e)"/><path d="M304.242 365.497c-12.75-7.354-27.707-6.128-44.87 3.677l-19.125 11.032c-11.278 6.373-21.699 15.811-31.261 28.313-9.563 12.502-17.286 25.984-23.171 40.447-5.884 14.463-8.827 28.313-8.827 41.551l-63.994-36.771c0-13.237 2.942-27.087 8.827-41.55 5.884-14.463 13.731-27.946 23.538-40.448 9.808-12.502 20.351-21.939 31.629-28.313l18.39-11.031c17.163-9.805 32.119-11.031 44.869-3.677l63.995 36.77Z" fill="url(#f)"/><path d="m176.989 416.976-63.995 36.77L49 416.976l63.994-36.77 63.995 36.77Z" fill="url(#g)"/><path d="m112.994 453.746 63.994-36.77v73.541c0-13.238 2.943-27.088 8.827-41.551 5.885-14.463 13.608-27.945 23.171-40.447 9.562-12.502 19.983-21.94 31.261-28.313l19.125-11.031c17.163-9.806 32.12-11.031 44.87-3.677 12.749 7.354 19.124 20.836 19.124 40.447 0-13.237 2.943-27.088 8.827-41.551 5.885-14.463 13.608-27.945 23.171-40.447 9.562-12.502 19.982-21.939 31.261-28.313l19.125-11.031c17.163-9.806 32.12-11.031 44.869-3.677 12.75 7.354 19.125 20.836 19.125 40.447v323.579l-63.994 36.77V358.144l-82.384 47.801v323.579l-63.994 36.77V442.715l-82.384 47.802v323.579l-63.994 36.77v-397.12Z" fill="url(#h)"/><path d="M259.372 369.174c-6.865 1.471-11.769 2.942-14.711 4.413a120.331 120.331 0 0 0-8.091 4.412c-11.279 6.374-21.7 15.811-31.262 28.313-9.562 12.502-17.041 26.23-22.435 41.183-5.394 14.953-7.356 29.294-5.884 43.021.98-12.256 4.658-25.494 11.033-39.712 6.375-14.217 14.466-27.577 24.274-40.079 9.807-12.502 20.351-21.94 31.629-28.313a124.916 124.916 0 0 0 7.356-4.781c2.452-1.715 5.149-4.535 8.091-8.457Zm146.378-84.571c-6.375 1.47-11.156 2.941-14.344 4.412-3.187 1.471-6.007 2.942-8.459 4.412-11.278 6.374-21.699 15.812-31.261 28.314-9.563 12.501-17.041 26.229-22.435 41.182-5.394 14.954-7.356 29.294-5.885 43.022.981-12.257 4.782-25.494 11.402-39.712 6.62-14.218 14.834-27.578 24.641-40.08 9.808-12.502 20.106-21.94 30.894-28.313a124.893 124.893 0 0 0 7.356-4.78c2.452-1.716 5.149-4.535 8.091-8.457ZM176.989 416.976c-18.144 7.844-31.998 14.463-41.56 19.856a25443.365 25443.365 0 0 1-26.113 14.708v84.204c0 29.171.246 63 .736 101.486.49 38.486 1.471 85.185 2.942 140.095 1.471-53.44 2.452-99.035 2.943-136.786.49-37.751.735-71.212.735-100.383v-84.204c7.846-4.412 16.305-9.437 25.377-15.076 9.072-5.638 20.719-13.605 34.94-23.9Z" fill="#fff"/><path d="M832.38 339.758c-12.75-7.354-27.461-6.128-44.134 3.677l-127.253 73.541c-11.279 6.373-21.822 15.811-31.63 28.313-9.807 12.502-17.653 25.984-23.538 40.447-5.884 14.463-8.827 28.314-8.827 41.551v279.454c0 19.611 6.375 33.094 19.125 40.448l-63.994-36.771c-12.75-7.354-19.125-20.836-19.125-40.447V490.517c0-13.238 2.942-27.088 8.827-41.551 5.884-14.463 13.73-27.945 23.538-40.447 9.807-12.502 20.351-21.94 31.629-28.313l127.253-73.541c17.164-9.806 32.12-11.031 44.87-3.677l63.259 36.77Zm-44.134 187.529-127.253 73.54-63.995-36.77 127.253-73.54 63.995 36.77Zm-127.253 73.54c0 19.611 6.375 33.094 19.124 40.448l-63.994-36.77c-12.75-7.355-19.125-20.837-19.125-40.448l63.995 36.77Zm127.253-183.851v110.311l-63.995-36.77V380.206l63.995 36.77Zm63.259 242.684L660.993 769.971l-63.995-36.77L788.246 622.89l63.259 36.77Zm-63.259-242.684-127.253 73.541v110.31l127.253-73.54V416.976Zm-127.253 0 127.253-73.541c16.673-9.805 31.384-11.031 44.134-3.677 12.75 7.354 19.125 20.837 19.125 40.448v110.311c0 12.747-2.943 26.474-8.827 41.182-5.885 14.708-13.608 28.313-23.171 40.815-9.562 12.502-19.983 21.94-31.261 28.313l-63.995 36.771c-16.672 9.805-31.384 11.031-44.134 3.677-12.749-7.354-19.124-20.837-19.124-40.448v169.144L851.505 659.66v73.541L660.993 843.512c-17.164 9.805-32.12 11.031-44.87 3.677-12.75-7.354-19.125-20.837-19.125-40.448V527.287c0-13.237 2.943-27.088 8.827-41.551 5.885-14.463 13.731-27.945 23.538-40.447 9.808-12.502 20.351-21.94 31.63-28.313Z" fill="#FFD215"/><path d="M851.504 659.66 660.992 769.971l-63.994-36.77L788.246 622.89l63.258 36.77Z" fill="url(#i)"/><path d="M788.246 416.976v110.311l-63.994-36.77V380.206l63.994 36.77Z" fill="url(#j)"/><path d="M660.992 600.827c0 19.611 6.375 33.094 19.125 40.448l-63.994-36.771c-12.75-7.354-19.125-20.836-19.125-40.447l63.994 36.77Z" fill="url(#k)"/><path d="m788.246 527.287-127.254 73.541-63.994-36.771 127.253-73.54 63.995 36.77Z" fill="url(#l)"/><path d="M832.38 339.758c-12.75-7.354-27.461-6.128-44.134 3.677l-127.253 73.541c-11.279 6.373-21.822 15.811-31.63 28.313-9.807 12.502-17.653 25.984-23.538 40.447-5.884 14.463-8.827 28.314-8.827 41.551v279.454c0 19.611 6.375 33.094 19.125 40.448l-63.994-36.771c-12.75-7.354-19.125-20.836-19.125-40.447V490.517c0-13.238 2.942-27.088 8.827-41.551 5.884-14.463 13.73-27.945 23.538-40.447 9.807-12.502 20.351-21.94 31.629-28.313l127.253-73.541c17.164-9.806 32.12-11.031 44.87-3.677l63.259 36.77Z" fill="url(#m)"/><path d="m788.246 416.976-127.254 73.541v110.311l127.254-73.541V416.976Zm-127.254 0 127.254-73.541c16.672-9.805 31.384-11.031 44.134-3.677 12.749 7.354 19.124 20.837 19.124 40.448v110.311c0 12.747-2.942 26.474-8.827 41.182-5.884 14.709-13.608 28.314-23.17 40.816-9.562 12.501-19.983 21.939-31.261 28.313l-63.995 36.77c-16.673 9.805-31.384 11.031-44.134 3.677-12.75-7.354-19.125-20.837-19.125-40.447v169.143L851.504 659.66v73.541L660.992 843.512c-17.163 9.805-32.119 11.031-44.869 3.677-12.75-7.354-19.125-20.837-19.125-40.448V527.287c0-13.237 2.942-27.087 8.827-41.55 5.884-14.463 13.73-27.946 23.538-40.448 9.808-12.502 20.351-21.939 31.629-28.313Z" fill="url(#n)"/><path d="M851.504 659.66c-25.499 12.747-45.36 23.043-59.581 30.887a7161.674 7161.674 0 0 0-39.72 22.062c-11.769 6.864-24.519 14.463-38.25 22.798-13.73 8.334-31.384 19.856-52.961 34.564 25.5-12.747 45.36-23.043 59.581-30.887a7296.667 7296.667 0 0 0 39.721-22.062c11.769-6.864 24.396-14.463 37.882-22.798 13.485-8.335 31.261-19.856 53.328-34.564Zm-63.258-316.225c-22.558 11.276-41.683 21.204-57.375 29.784a9763.66 9763.66 0 0 0-40.824 22.43 1358.148 1358.148 0 0 0-33.468 19.12c-11.279 6.374-21.699 15.812-31.262 28.314-9.562 12.502-17.285 25.984-23.17 40.447-5.884 14.463-8.827 28.313-8.827 41.55v72.806c0 25.494.245 54.787.736 87.881.49 33.093 1.471 73.418 2.942 120.974 1.471-46.085 2.452-85.43 2.942-118.033.491-32.603.736-61.529.736-86.778v-72.437c0-13.237 2.942-27.088 8.827-41.551 5.884-14.463 13.73-27.945 23.538-40.447 9.807-12.502 20.351-21.94 31.629-28.313a11371.19 11371.19 0 0 1 51.122-30.152c18.389-10.786 42.541-25.984 72.454-45.595Zm0 73.541c-1.962 26.474-3.065 47.679-3.31 63.612a2893.617 2893.617 0 0 0-.368 44.492 4271.69 4271.69 0 0 0-51.49 30.152c-18.144 10.786-42.172 25.984-72.086 45.595a40243.3 40243.3 0 0 1 56.639-30.151c15.692-8.335 29.3-15.812 40.824-22.43a1737.21 1737.21 0 0 1 33.468-18.753c0-13.728-.122-28.804-.367-45.228-.246-16.424-1.349-38.854-3.31-67.289Z" fill="#fff"/><path d="M947.864 501.548v73.541l-63.995-36.771v-73.54l63.995 36.77Zm63.256-110.311v73.541l-63.256-36.771v-73.54l63.256 36.77Zm64-36.77-64 36.77-63.256-36.77 63.256-36.771 64 36.771Zm-64 183.851v279.455c0 19.61 6.38 33.093 19.13 40.447l-63.262-36.77c-12.75-7.354-19.124-20.837-19.124-40.448V501.548l63.256 36.77Zm0-73.54-63.256 36.77-63.995-36.77 63.995-36.771 63.256 36.771Zm191.25-110.311-63.99 36.77c-11.28 6.373-21.7 15.811-31.27 28.313-9.56 12.502-17.28 25.984-23.17 40.447-5.88 14.463-8.82 28.314-8.82 41.551l-64-36.77c0-13.238 2.94-27.088 8.83-41.551 5.88-14.463 13.73-27.945 23.54-40.447 9.8-12.502 20.35-21.94 31.63-28.313l63.26-36.771 63.99 36.771Zm0 352.995-127.25 73.54-64-36.77 127.26-73.541 63.99 36.771Zm-191.25-169.144-63.256 36.771v-73.541l63.256-36.77v-73.541l64-36.77v147.081c0-13.237 2.94-27.088 8.82-41.551 5.89-14.463 13.61-27.945 23.17-40.447 9.57-12.502 19.99-21.94 31.27-28.313l63.99-36.77v73.54l-127.25 73.541v279.454l127.25-73.54v73.54l-127.25 73.541c-17.17 9.805-32.12 11.031-44.87 3.677-12.75-7.354-19.13-20.837-19.13-40.447V538.318Z" fill="#FFD215"/><path d="m1202.37 707.462-127.25 73.54-64-36.77 127.26-73.541 63.99 36.771Z" fill="url(#o)"/><path d="m1202.37 354.467-63.99 36.77c-11.28 6.373-21.7 15.811-31.27 28.313-9.56 12.502-17.28 25.984-23.17 40.447-5.88 14.463-8.82 28.314-8.82 41.551l-64-36.77c0-13.238 2.95-27.088 8.83-41.551 5.88-14.463 13.73-27.945 23.54-40.447 9.81-12.502 20.35-21.94 31.63-28.313l63.26-36.771 63.99 36.771Z" fill="url(#p)"/><path d="m1011.12 464.778-63.256 36.77-63.995-36.77 63.995-36.771 63.256 36.771Z" fill="url(#q)"/><path d="M1011.12 538.318v279.455c0 19.61 6.38 33.093 19.13 40.447l-63.262-36.77c-12.75-7.354-19.125-20.837-19.125-40.448V501.548l63.257 36.77Z" fill="url(#r)"/><path d="m1075.12 354.467-64 36.77-63.257-36.77 63.257-36.771 64 36.771Z" fill="url(#s)"/><path d="M1011.12 391.237v73.541l-63.257-36.771v-73.54l63.257 36.77Z" fill="url(#t)"/><path d="M947.864 501.548v73.54l-63.995-36.77v-73.541l63.995 36.771Z" fill="url(#u)"/><path d="m1011.12 538.318-63.257 36.771v-73.541l63.257-36.77v-73.541l64-36.77v147.081c0-13.237 2.94-27.087 8.82-41.55 5.89-14.463 13.61-27.946 23.17-40.448 9.57-12.502 19.99-21.939 31.27-28.313l63.99-36.77v73.54l-127.25 73.541v279.455l127.25-73.541v73.541l-127.25 73.54c-17.17 9.806-32.12 11.031-44.87 3.677-12.75-7.354-19.13-20.836-19.13-40.447V538.318Z" fill="url(#v)"/><path d="M1011.12 611.859c-1.96 24.023-3.06 43.389-3.31 58.097-.24 14.708-.37 28.436-.37 41.183s0 27.455.37 42.654c.37 15.198 1.35 36.525 3.31 63.98 1.96-25.004 3.07-44.983 3.31-59.936.25-14.953.37-29.048.37-42.286 0-13.237 0-26.597-.37-41.55-.24-14.953-1.35-35.667-3.31-62.142Zm191.25 95.603c-18.63 8.334-32.86 15.198-42.66 20.591-9.81 5.393-18.88 10.541-27.22 15.444-7.85 4.412-16.06 9.315-24.64 14.708-8.58 5.393-19.49 12.992-32.73 22.798 17.16-7.845 30.4-14.218 39.72-19.121 9.31-4.903 17.65-9.56 25.01-13.973a2546.63 2546.63 0 0 0 26.48-15.811c9.31-5.638 21.33-13.85 36.04-24.636Zm0-352.995c-17.65 7.844-31.38 14.463-41.19 19.856a3054.076 3054.076 0 0 0-26.48 14.708c-11.28 6.373-21.7 15.811-31.26 28.313-9.57 12.502-17.04 26.23-22.44 41.183-5.39 14.953-7.35 29.293-5.88 43.021.98-12.257 4.78-25.494 11.4-39.712 6.62-14.218 14.83-27.578 24.64-40.08 9.81-12.501 20.35-21.939 31.63-28.313 7.84-4.412 16.18-9.437 25.01-15.075 8.82-5.639 20.35-13.606 34.57-23.901Zm-127.25 0c-18.15 7.844-32 14.463-41.56 19.856-9.57 5.393-18.27 10.295-26.12 14.708v73.541c-7.842 4.412-16.301 9.437-25.373 15.075-9.072 5.638-20.473 13.605-34.204 23.901 17.654-8.335 31.262-15.076 40.824-20.224a1637.288 1637.288 0 0 0 26.113-14.34v-73.541c8.34-4.412 16.92-9.437 25.74-15.075 8.83-5.639 20.36-13.606 34.58-23.901Z" fill="#fff"/><path d="M1329.62 453.746v73.541l-63.99-36.77v-73.541l63.99 36.77ZM1565 339.758c-12.74-7.354-27.46-6.128-44.13 3.677l-191.25 110.311-63.99-36.77 191.25-110.311c17.16-9.806 32.12-11.031 44.87-3.677l63.25 36.77Zm-44.13 180.175-127.25 73.54c-11.28 6.374-21.82 15.812-31.63 28.314-9.81 12.501-17.66 25.984-23.54 40.447-5.88 14.463-8.83 28.313-8.83 41.55v102.957c0 19.611 6.38 33.094 19.13 40.448l-64-36.771c-12.75-7.354-19.12-20.836-19.12-40.447V667.014c0-13.237 2.94-27.087 8.83-41.55 5.88-14.463 13.73-27.946 23.53-40.448 9.81-12.502 20.35-21.939 31.63-28.313l127.26-73.541 63.99 36.771Zm0 176.497-127.25 73.541-64-36.77 127.26-73.541 63.99 36.77Zm0-102.957V696.43l-63.99-36.77V556.703l63.99 36.77Zm0 102.957v73.541l-63.99-36.77V659.66l63.99 36.77Zm0-279.454v102.957l-63.99-36.771V380.206l63.99 36.77Zm-127.25 352.995 127.25-73.541V593.473l-127.25 73.541v102.957Zm-64-316.225 191.25-110.311c16.67-9.805 31.39-11.031 44.13-3.677 12.75 7.354 19.13 20.837 19.13 40.448v352.995l-63.26 36.77V696.43c0 12.747-2.94 26.475-8.83 41.183-5.88 14.708-13.73 28.313-23.53 40.815-9.81 12.502-20.35 21.94-31.63 28.313l-63.26 36.771c-17.17 9.805-32.12 11.031-44.87 3.677-12.75-7.354-19.13-20.837-19.13-40.448V703.784c0-13.237 2.95-27.087 8.83-41.55 5.88-14.463 13.73-27.946 23.54-40.447 9.81-12.502 20.35-21.94 31.63-28.314l127.25-73.54V416.976l-191.25 110.311v-73.541Z" fill="#FFD215"/><path d="M1520.87 416.976v102.957l-63.99-36.771V380.206l63.99 36.77Z" fill="url(#w)"/><path d="M1520.87 696.43v73.541l-63.99-36.77V659.66l63.99 36.77Z" fill="url(#x)"/><path d="M1520.87 593.473V696.43l-63.99-36.77V556.703l63.99 36.77Z" fill="url(#y)"/><path d="m1520.87 696.43-127.25 73.541-64-36.77 127.26-73.541 63.99 36.77Z" fill="url(#z)"/><path d="m1520.87 519.933-127.25 73.541c-11.28 6.373-21.82 15.811-31.63 28.313-9.81 12.502-17.66 25.984-23.54 40.447-5.88 14.463-8.83 28.313-8.83 41.551v102.956c0 19.611 6.38 33.094 19.13 40.448l-64-36.771c-12.75-7.354-19.12-20.836-19.12-40.447V667.014c0-13.237 2.94-27.087 8.83-41.55 5.88-14.463 13.73-27.946 23.53-40.448 9.81-12.502 20.35-21.939 31.63-28.313l127.26-73.54 63.99 36.77Z" fill="url(#A)"/><path d="M1565 339.758c-12.74-7.354-27.46-6.128-44.13 3.677l-191.25 110.311-63.99-36.77 191.25-110.311c17.16-9.806 32.12-11.031 44.87-3.677l63.25 36.77Z" fill="url(#B)"/><path d="M1329.62 453.746v73.541l-63.99-36.77v-73.541l63.99 36.77Z" fill="url(#C)"/><path d="m1393.62 769.971 127.25-73.54V593.474l-127.25 73.54v102.957Zm-64-316.225 191.25-110.311c16.67-9.805 31.38-11.031 44.13-3.677 12.75 7.354 19.13 20.837 19.13 40.448v352.995l-63.26 36.77v-73.54c0 12.747-2.94 26.474-8.83 41.182-5.88 14.708-13.73 28.313-23.53 40.815-9.81 12.502-20.36 21.94-31.63 28.313l-63.26 36.771c-17.17 9.805-32.12 11.031-44.87 3.677-12.75-7.354-19.13-20.837-19.13-40.448V703.785c0-13.238 2.95-27.088 8.83-41.551 5.88-14.463 13.73-27.945 23.54-40.447 9.81-12.502 20.35-21.94 31.63-28.313l127.25-73.541V416.976l-191.25 110.311v-73.541Z" fill="url(#D)"/><path d="M1520.87 343.435c-33.35 17.65-61.54 32.848-84.59 45.595-23.05 12.747-43.28 24.024-60.68 33.829-17.41 9.805-33.96 19.366-49.65 28.681 0 9.315 0 19.365.36 30.151.25 10.786 1.35 25.985 3.31 45.596 1.96-17.16 3.07-31.01 3.31-41.551.25-10.541.37-20.469.37-29.784a7772.557 7772.557 0 0 0 50.02-29.048c17.16-10.051 36.66-21.695 58.48-34.932 21.82-13.237 48.18-29.416 79.07-48.537Zm0 250.038c-1.96 24.514-3.06 44.247-3.31 59.2-.24 14.954-.37 28.804-.37 41.551-16.18 9.315-33.34 19.366-51.49 30.152-18.14 10.786-42.17 25.984-72.08 45.595 22.06-11.767 40.94-21.817 56.64-30.152 15.69-8.335 29.3-15.811 40.82-22.43a1729.941 1729.941 0 0 1 33.47-18.753c0-12.747 0-26.719-.37-41.918-.24-15.198-1.35-36.28-3.31-63.245Zm0-176.497c-1.96 24.513-3.06 44.247-3.31 59.2-.24 14.953-.37 28.803-.37 41.55l-127.99 73.541c-11.27 6.374-21.7 15.811-31.26 28.313-9.56 12.502-17.28 25.985-23.17 40.448-5.88 14.462-8.82 28.313-8.82 41.55 0 10.296 0 21.327.36 33.093.25 11.767 1.35 28.436 3.31 50.008 1.96-19.121 3.07-34.442 3.31-45.963.25-11.521.37-22.43.37-32.726 0-13.237 2.94-27.087 8.83-41.55 5.88-14.463 13.73-27.945 23.54-40.447 9.8-12.502 20.35-21.94 31.63-28.314l127.25-73.54c0-12.747 0-26.72-.37-41.918-.37-15.199-1.35-36.28-3.31-63.245Z" fill="#fff"/><path d="M1712.12 262.541v544.2c0 19.611 6.37 33.094 19.12 40.448l-63.99-36.771c-12.75-7.354-19.13-20.836-19.13-40.447V225.77l64 36.771ZM1871 714.816l-94.89 55.155-63.99-36.77 95.62-55.156 63.26 36.771Zm-94.89-489.046-63.99 36.771-64-36.771 64-36.77 63.99 36.77Zm0 544.201 94.89-55.155v73.54l-94.89 55.156c-17.16 9.805-32.12 11.031-44.87 3.677-12.75-7.354-19.12-20.837-19.12-40.448v-544.2l63.99-36.771v544.201Z" fill="#FFD215"/><path d="m1776.11 225.77-63.99 36.771-64-36.771 64-36.77 63.99 36.77Z" fill="url(#E)"/><path d="m1871 714.816-94.89 55.155-63.99-36.77 95.62-55.156 63.26 36.771Z" fill="url(#F)"/><path d="M1712.12 262.541v544.201c0 19.61 6.37 33.093 19.12 40.447l-63.99-36.77c-12.75-7.354-19.13-20.837-19.13-40.448v-544.2l64 36.77Z" fill="url(#G)"/><path d="m1776.11 769.971 94.89-55.155v73.54l-94.89 55.156c-17.16 9.805-32.12 11.031-44.87 3.677-12.75-7.354-19.12-20.837-19.12-40.447V262.541l63.99-36.77v544.2Z" fill="url(#H)"/><path d="M1871 714.816c-12.75 5.393-22.56 9.805-29.42 13.237-6.87 3.432-13 6.864-18.39 10.296-6.38 3.432-13.12 7.476-20.23 12.134-7.11 4.658-16.06 11.154-26.85 19.488 14.22-6.373 25.26-11.644 33.1-15.811 7.85-4.167 14.96-7.967 21.33-11.399 5.4-3.432 11.28-7.109 17.66-11.031 6.37-3.922 13.97-9.56 22.8-16.914Zm-94.89-489.045c-18.14 7.844-32 14.463-41.56 19.855-9.56 5.393-18.26 10.296-26.11 14.709v104.427c0 35.79 0 74.767.37 116.93.24 42.163.61 89.72 1.1 142.669.49 52.949 1.23 113.743 2.21 182.381.98-67.658 1.71-127.593 2.2-179.807.49-52.214.86-99.28 1.11-141.198.24-41.918.37-80.772.37-116.562V264.747c7.84-4.412 16.3-9.438 25.37-15.076s20.72-13.605 34.94-23.9Z" fill="#fff"/></g><defs><linearGradient id="b" x1="307.078" y1="626.731" x2="447.501" y2="384.534" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="c" x1="159.32" y1="710.208" x2="299.743" y2="468.011" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="d" x1="307.334" y1="399.183" x2="380.742" y2="272.57" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".13" stop-color="#F3993A"/><stop offset=".37" stop-color="#F6B460"/><stop offset=".7" stop-color="#FBDF9E"/><stop offset=".87" stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="e" x1="-2.166" y1="785.158" x2="170.165" y2="487.926" gradientUnits="userSpaceOnUse"><stop stop-color="#EA5636"/><stop offset="1" stop-color="#F28F2C"/></linearGradient><linearGradient id="f" x1="4993.55" y1="-7846.29" x2="5066.96" y2="-7972.9" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".13" stop-color="#F3993A"/><stop offset=".37" stop-color="#F6B460"/><stop offset=".7" stop-color="#FBDF9E"/><stop offset=".87" stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="g" x1="96.991" y1="444.188" x2="128.899" y2="389.153" gradientUnits="userSpaceOnUse"><stop stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="h" x1="353.347" y1="690.131" x2="162.738" y2="358.444" gradientUnits="userSpaceOnUse"><stop stop-color="#FFD316"/><stop offset=".29" stop-color="#FFD92B"/><stop offset=".88" stop-color="#FFE862"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="i" x1="673.736" y1="784.61" x2="772.659" y2="613.99" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".2" stop-color="#F39C35"/><stop offset=".59" stop-color="#F8BF4E"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="j" x1="3887.62" y1="-4933.63" x2="784.111" y2="419.211" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="k" x1="1476.23" y1="-832.101" x2="647.563" y2="597.157" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="l" x1="5702.61" y1="-8082.13" x2="5779.21" y2="-8214.25" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".2" stop-color="#F39C35"/><stop offset=".59" stop-color="#F8BF4E"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="m" x1="516.107" y1="753.999" x2="764.981" y2="324.746" gradientUnits="userSpaceOnUse"><stop stop-color="#EA5636"/><stop offset=".49" stop-color="#F28F2C"/><stop offset=".52" stop-color="#F3993A"/><stop offset=".6" stop-color="#F6B460"/><stop offset=".69" stop-color="#FBDF9E"/><stop offset=".74" stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="n" x1="-11752" y1="-21107.7" x2="-11942.6" y2="-21439.4" gradientUnits="userSpaceOnUse"><stop stop-color="#FFD316"/><stop offset=".29" stop-color="#FFD92B"/><stop offset=".88" stop-color="#FFE862"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="o" x1="5899.3" y1="-7529.36" x2="5972.71" y2="-7655.98" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".2" stop-color="#F39C35"/><stop offset=".59" stop-color="#F8BF4E"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="p" x1="1053.38" y1="487.818" x2="1149.1" y2="322.713" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".14" stop-color="#F39C35"/><stop offset=".39" stop-color="#F8BF4E"/><stop offset=".67" stop-color="#FFEC6F"/><stop offset=".79" stop-color="#FEEF89"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="q" x1="930.62" y1="488.174" x2="984.846" y2="394.647" gradientUnits="userSpaceOnUse"><stop stop-color="#FEF7C0"/><stop offset=".25" stop-color="#FADA97"/><stop offset=".76" stop-color="#F4A44A"/><stop offset="1" stop-color="#F28F2C"/></linearGradient><linearGradient id="r" x1="934.47" y1="769.582" x2="1055.71" y2="560.47" gradientUnits="userSpaceOnUse"><stop stop-color="#EA5636"/><stop offset=".47" stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="s" x1="995.413" y1="381.802" x2="1027.32" y2="326.767" gradientUnits="userSpaceOnUse"><stop stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="t" x1="963.489" y1="436.834" x2="995.398" y2="381.799" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#F28F2C"/></linearGradient><linearGradient id="u" x1="900.192" y1="547.216" x2="932.101" y2="492.181" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#F28F2C"/></linearGradient><linearGradient id="v" x1="-11369.5" y1="-21107.7" x2="-11560.1" y2="-21439.4" gradientUnits="userSpaceOnUse"><stop stop-color="#FFD316"/><stop offset=".29" stop-color="#FFD92B"/><stop offset=".88" stop-color="#FFE862"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="w" x1="4410.75" y1="-4578.51" x2="1514.41" y2="417.023" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="x" x1="3237.55" y1="-2298.78" x2="1500.55" y2="697.167" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="y" x1="4403.76" y1="-4485.35" x2="1513.54" y2="586.978" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="z" x1="6435.23" y1="-7912.99" x2="6511.84" y2="-8045.11" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".2" stop-color="#F39C35"/><stop offset=".59" stop-color="#F8BF4E"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="A" x1="1288.78" y1="784.121" x2="1461.11" y2="486.889" gradientUnits="userSpaceOnUse"><stop stop-color="#EA5636"/><stop offset=".26" stop-color="#F28F2C"/><stop offset=".63" stop-color="#F28F2C"/><stop offset=".71" stop-color="#F39C35"/><stop offset=".85" stop-color="#F8BF4E"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="B" x1="1362.23" y1="471.238" x2="1457.95" y2="306.133" gradientUnits="userSpaceOnUse"><stop stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="C" x1="1281.7" y1="499.219" x2="1313.6" y2="444.184" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#F28F2C"/></linearGradient><linearGradient id="D" x1="-11019.4" y1="-21107.7" x2="-11210" y2="-21439.4" gradientUnits="userSpaceOnUse"><stop stop-color="#FFD316"/><stop offset=".29" stop-color="#FFD92B"/><stop offset=".88" stop-color="#FFE862"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="E" x1="1696.11" y1="252.982" x2="1728.02" y2="197.947" gradientUnits="userSpaceOnUse"><stop stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="F" x1="5952.06" y1="-6449.73" x2="6015.87" y2="-6559.8" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".2" stop-color="#F39C35"/><stop offset=".59" stop-color="#F8BF4E"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="G" x1="1580.73" y1="730.614" x2="1816.87" y2="323.312" gradientUnits="userSpaceOnUse"><stop stop-color="#EA5636"/><stop offset="1" stop-color="#F28F2C"/></linearGradient><linearGradient id="H" x1="-10680" y1="-21082.9" x2="-10870.6" y2="-21414.6" gradientUnits="userSpaceOnUse"><stop stop-color="#FFD316"/><stop offset=".29" stop-color="#FFD92B"/><stop offset=".88" stop-color="#FFE862"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><clipPath id="a"><path fill="#fff" transform="translate(49 189)" d="M0 0h1822v674H0z"/></clipPath></defs></svg>
\ No newline at end of file
--- /dev/null
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 3130 1395" width="3130" height="1395">
+ <defs>
+ <radialGradient id="svg[326].g1" cx="277" cy="-196" r="475" gradientUnits="userSpaceOnUse">
+ <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
+ <stop offset="1" stop-color="#D22E1F"/>
+ </radialGradient>
+ <radialGradient id="svg[326].g2" cx="255" cy="-195" r="260" gradientUnits="userSpaceOnUse">
+ <stop offset="0" stop-color="#0074B6"/>
+ <stop offset="1" stop-color="#0074B6" stop-opacity="0.252"/>
+ </radialGradient>
+ <path d="M256,-199 Q284,-207 298,-222.5 Q312,-238 317,-255 Q322,-272 322,-284 Q322,-318 300,-338.5 Q278,-359 244,-359 Q221,-359 198,-345 Q175,-331 167,-331 Q154,-331 149,-336 L154,-344 Q156,-343 160,-343 Q174,-343 182,-357.5 Q190,-372 197,-380 Q224,-418 254,-418 Q288,-418 302,-383 L304,-385 Q294,-406 294,-431 Q294,-470 345,-521 Q350,-526 357.5,-533 Q365,-540 374,-548 L401,-574 Q419,-590 425,-603 Q407,-608 407,-622 Q407,-640 427,-640 Q446,-640 446,-621 Q446,-609 429,-583 Q416,-566 407.5,-552 Q399,-538 394,-528 Q348,-442 348,-327 Q348,-211 277,-196 Q348,-180 348,-65 Q348,50 394,136 Q399,146 407.5,160 Q416,174 429,191 Q446,217 446,229 Q446,248 427,248 Q407,248 407,230 Q407,215 425,211 Q419,198 401,182 L374,156 Q365,148 357.5,141 Q350,134 345,129 Q294,78 294,39 Q294,14 304,-7 L302,-9 Q288,26 254,26 Q224,26 197,-12 Q190,-20 182,-34.5 Q174,-49 160,-49 Q156,-49 154,-48 L149,-56 Q154,-61 167,-61 Q175,-61 198,-47 Q221,-33 244,-33 Q278,-33 300,-53.5 Q322,-74 322,-108 Q322,-120 317,-136.5 Q312,-153 298,-168 Q284,-183 256,-191 Z" id="svg[326].uniFD3E.0" fill="url(#svg[326].g1)"/>
+ <path d="M217,-51 Q172,-93 172,-144 Q162,-132 141,-132 Q115,-132 96,-152 L77,-173 Q68,-184 59,-184 Q48,-184 43,-181 L39,-191 Q52,-198 68,-215 Q84,-234 100.5,-248 Q117,-262 141,-262 Q158,-262 172,-248 Q172,-298 217,-340 L225,-336 Q220,-321 220,-311 Q220,-277 260,-266 Q292,-257 292,-233 Q292,-219 279.5,-210.5 Q267,-202 256,-195 Q270,-187 281,-180 Q292,-173 292,-159 Q292,-134 260,-125 Q220,-114 220,-81 Q220,-70 225,-55 Z M184,-165 Q193,-183 215,-195 L215,-197 Q193,-209 184,-227 Q148,-220 148,-196 Q148,-173 184,-165 Z" id="svg[326].uniFD3E.1" fill="url(#svg[326].g2)"/>
+ <linearGradient id="svg[284].g1" x1="37" y1="40" x2="-29.457" y2="-32.498" gradientUnits="userSpaceOnUse">
+ <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
+ <stop offset="1" stop-color="#D22E1F"/>
+ </linearGradient>
+ <path d="M79,-13 Q59,13 38.5,38.5 Q18,64 -3,90 L-74,24 L8,-79 Z" id="svg[284].glyph00490.0" fill="url(#svg[284].g1)"/>
+ <linearGradient id="svg[306].g1" x1="172" y1="-500" x2="243.874" y2="-472.668" gradientUnits="userSpaceOnUse">
+ <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
+ <stop offset="1" stop-color="#D22E1F"/>
+ </linearGradient>
+ <linearGradient id="svg[306].g2" x1="27" y1="225" x2="183.383" y2="-109.821" gradientUnits="userSpaceOnUse">
+ <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
+ <stop offset="1" stop-color="#D22E1F"/>
+ </linearGradient>
+ <linearGradient id="svg[306].g3" x1="261" y1="-315" x2="182.349" y2="-422.523" gradientUnits="userSpaceOnUse">
+ <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
+ <stop offset="1" stop-color="#D22E1F"/>
+ </linearGradient>
+ <linearGradient id="svg[8].g1" x1="113" y1="-638" x2="136.061" y2="-260.004" gradientUnits="userSpaceOnUse">
+ <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
+ <stop offset="1" stop-color="#D22E1F"/>
+ </linearGradient>
+ <linearGradient id="svg[13].g1" x1="-92" y1="-17" x2="-59.148" y2="-21.978" gradientUnits="userSpaceOnUse">
+ <stop offset="0" stop-color="#D22E1F" stop-opacity="0.252"/>
+ <stop offset="1" stop-color="#D22E1F"/>
+ </linearGradient>
+ <linearGradient id="svg[86].g1" x1="-5" y1="-69" x2="428.976" y2="-137.153" gradientUnits="userSpaceOnUse">
+ <stop offset="0" stop-color="#D22E1F"/>
+ <stop offset="1" stop-color="#D22E1F"/>
+ </linearGradient>
+ <path d="M242,-16 Q228,-16 215.5,-19 Q203,-22 203,-33 Q203,-39 204,-42 Q184,-34 145.5,-25 Q107,-16 67,-9.5 Q27,-3 0,0 L22,-132 Q207,-144 252,-169 Q281,-185 295,-218 Q298,-221 299,-221 Q300,-221 300,-216 Q300,-206 299,-204 Q295,-192 288,-174.5 Q281,-157 270,-133 L271,-132 Q304,-135 333,-141 Q376,-191 420.5,-239 Q465,-287 513,-332 Q526,-344 551,-354.5 Q576,-365 604,-365 Q633,-365 653.5,-344 Q674,-323 674,-295 Q674,-277 666,-262 Q641,-213 609.5,-174.5 Q578,-136 532,-107 Q507,-91 479,-77 Q451,-63 421,-52 Q405,-48 380.5,-41.5 Q356,-35 331,-29 Q306,-23 286,-20 Q274,-18 263,-17 Q252,-16 242,-16 Z M573,-213 Q573,-232 555.5,-243.5 Q538,-255 516,-255 Q509,-255 502,-254 Q495,-253 489,-249 Q454,-230 426.5,-202 Q399,-174 372,-147 Q425,-158 474.5,-170 Q524,-182 567,-203 Q573,-206 573,-213 Z" id="svg[86].glyph00116.0" fill="url(#svg[86].g1)"/>
+ </defs>
+ <g transform="translate(0, 1032)">
+ <g transform="translate(0, 0)">
+ <use xlink:href="#svg[326].uniFD3E.0"/>
+ <use xlink:href="#svg[326].uniFD3E.1"/>
+ </g>
+ <g transform="translate(678, -756)">
+ <use xlink:href="#svg[284].glyph00490.0"/>
+ </g>
+ <g transform="translate(485, 0)">
+ <path d="M174,-488 L185,-588 Q212,-612 242,-612 Q268,-611 291,-606 Q314,-601 339,-595 L297,-465 Q270,-473 240,-479 Q210,-485 174,-488 Z" fill="url(#svg[306].g1)"/>
+ <path d="M451,-455 Q432,-404 423,-380.5 Q414,-357 411,-349.5 Q408,-342 406,-338 Q398,-320 377.5,-301 Q357,-282 332.5,-263 Q308,-244 288,-227 Q274,-214 245.5,-189 Q217,-164 183.5,-131 Q150,-98 119,-61 Q88,-24 68.5,12 Q49,48 49,78 Q49,101 64,119 Q120,181 197.5,205 Q275,229 360,229 Q432,229 503.5,216.5 Q575,204 635,188 Q641,186 647,186 Q649,186 649,187 Q649,187 649,187 Q649,187 648,188 Q604,241 539,280.5 Q474,320 400.5,341.5 Q327,363 256,363 Q173,363 111.5,330 Q50,297 21,238 Q-8,179 4,102 Q19,9 52.5,-60.5 Q86,-130 132,-183.5 Q178,-237 231.5,-281 Q285,-325 341.5,-366.5 Q398,-408 451,-455 Z" fill="url(#svg[306].g2)"/>
+ <path d="M407,-340 L218,-252 Q206,-261 195.5,-272 Q185,-283 176,-295 Q152,-325 141.5,-361.5 Q131,-398 131,-435 Q131,-482 145.5,-523 Q160,-564 185,-588 Q187,-526 192,-489 Q197,-452 210.5,-429 Q224,-406 248,-385 Q257,-376 268,-372.5 Q279,-369 291,-369 Q316,-369 345,-382 Q374,-395 402,-415 Q430,-435 452,-456 Z" fill="url(#svg[306].g3)"/>
+ </g>
+ <g transform="translate(1168, 0)">
+ <path d="M73,-570 L136,-687 L174,-118 L112,0 Z" fill="url(#svg[8].g1)"/>
+ </g>
+ <g transform="translate(1429, 171)">
+ <use xlink:href="#svg[284].glyph00490.0"/>
+ </g>
+ <g transform="translate(1280, 0)">
+ <path d="M205,-24 Q201,-23 201.5,-29.5 Q202,-36 203,-41 Q180,-31 143,-23 Q106,-15 67.5,-9 Q29,-3 0,0 L21,-127 Q30,-128 58.5,-131 Q87,-134 123,-139 Q159,-144 192.5,-150.5 Q226,-157 246,-166 Q265,-174 277.5,-189.5 Q290,-205 295,-218 Q299,-226 300,-216.5 Q301,-207 299,-205 Q292,-182 279.5,-149.5 Q267,-117 249,-84 Q231,-51 206,-24 Z" fill="url(#svg[13].g1)"/>
+ </g>
+ <g transform="translate(1478, -22)">
+ <use xlink:href="#svg[86].glyph00116.0"/>
+ </g>
+ <g transform="translate(2199, 0)">
+ <use xlink:href="#svg[326].uniFD3E.0" x="485" y="-392" transform="matrix(-1 0 0 -1 970 -784)"/>
+ <use xlink:href="#svg[326].uniFD3E.1" x="485" y="-392" transform="matrix(-1 0 0 -1 970 -784)"/>
+ </g>
+ </g>
+</svg>
name: "Color fonts"
-excerpt: "A font that can use multiple colors and specifies what they should be, as opposed to just specifying where 'ink' in the foreground color should go but not what that color should be."
+excerpt: "A font that can use multiple colors in a single glyph, rather than a flat single color used by non-color (monochromatic) fonts."
related_lessons: "introducing_color_fonts"
-related_content_urls: "https://www.youtube.com/embed/uaihftkZc68"
-A designspace (sometimes written as “design space”) is a system specified during the type design process that controls how a variable font’s appearance changes, via interpolation from the master designs and glyph substitution, as its variation axes are adjusted.
+A designspace (sometimes written as “design space”) is a system specified during the [type](/glossary/type) design process that controls how a [variable font](/glossary/variable_fonts)’s appearance changes, via interpolation from the [master](/glossary/masters) designs and [glyph](/glossary/glyph) substitution, as its variation [axes](/glossary/axis_in_variable_fonts) are adjusted.
<figure>
</figure>
-Each variation axis can be conceived as a dimension in the font’s design space, so each distinct set of axis values implies a unique location in the design space, and each unique location results in a unique instance. For example, a variable font with Weight and Width axes has a two-dimensional design space, containing all variants of Weight and Width. Some advanced variable fonts, such as parametric fonts, have 10 or more axes; therefore they have design spaces of 10 or more dimensions.
+Each variation axis can be conceived as a dimension in the font’s designspace, so each distinct set of axis values implies a unique location in the designspace, and each unique location results in a unique [instance](/glossary/instance). For example, a variable font with [Weight](/glossary/weight_axis) and [Width](/glossary/width_axis) axes has a two-dimensional designspace, containing all variants of Weight and Width. Some advanced variable fonts, such as [parametric fonts](/glossary/parametric_font), have 10 or more axes; therefore they have designspaces of 10 or more dimensions.
-An emoji is a pictogram intended to convey emotional meaning, usually used as a supplement to text in order to clarify intent (for example, a “winking face” emoji to signify sarcasm) or instead of emotive text (for example, a “thumbs up” emoji as an affirmative response). Although sometimes referred to as “smileys” due to the many facial expressions available as emoji, the full range of emoji is much larger than facial expressions.
+An emoji is a pictogram intended to convey emotional meaning, usually used as a supplement to [text](/glossary/text_copy) in order to clarify intent (for example, a “winking face” emoji to signify sarcasm) or instead of emotive text (for example, a “thumbs up” emoji as an affirmative response). Although sometimes referred to as “smileys” due to the many facial expressions available as emoji, the full range of emoji is much larger than facial expressions.
The emoji are successors to the original smileys, or emoticons: A sequence of punctuation glyphs to imitate an expression, such as a semi-colon and right parenthesis used to convey a wink ;)
</figure>
-The complete set (over 1,874 in version 15) is defined by the Unicode Consortium with contributions from hardware and software makers, as well as communications specialists. Unicode assigns each emoji a number known as a code point, allowing devices to treat emoji as characters in a font — and indeed modern operating systems have emoji fonts built in. Each maker designs emoji in their own style, so the smiley face character on an Apple device is different from the smiley face in Windows or Android.
+The complete set (over 1,874 in version 15) is defined by the [Unicode](/glossary/unicode) Consortium with contributions from hardware and software makers, as well as communications specialists. Unicode assigns each emoji a number known as a code point, allowing devices to treat emoji as characters in a font — and indeed modern operating systems have emoji fonts built in. Each maker designs emoji in their own style, so the smiley face character on an Apple device is different from the smiley face in Windows or Android.
-Depending on the system, it may be possible to override the default emoji font and achieve cross-platform consistency. For example, on a website with a monochrome style, a designer might choose the black and white [Noto Emoji](https://fonts.google.com/noto/specimen/Noto+Emoji).
\ No newline at end of file
+Depending on the system, it may be possible to override the default emoji [font](/glossary/font) and achieve cross-platform consistency. For example, on a website with a monochrome style, a designer might choose the black and white [Noto Emoji](https://fonts.google.com/noto/specimen/Noto+Emoji).
\ No newline at end of file
In linguistics, the atomic units of a writing system are called graphemes (similar in concept to [characters](/glossary/character) in [typography](/glossary/typography)); letters, which are associated with alphabets, constitute just one type of grapheme.
-In everyday discourse, however, people often use the term letters in a less restrictive sense. For example, they may refer to both the phonograms of the English alphabet (e.g., A, B, C) and to the signs/symbols used in the non-alphabetic Cherokee syllabary (e.g., Ꭰ, Ꭷ, Ꭽ) as letters.
+In everyday discourse, however, people often use the term letters in a less restrictive sense. For example, they may refer to both the phonograms of the English alphabet (e.g., A, B, C) and to the signs/symbols used in the non-alphabetic Cherokee syllabary (e.g., Ꭰ, Ꭷ, Ꭽ) as letters.
In contrast, the term commonly used when referring to logograms, which are graphemes associated with writing systems like Chinese (e.g., 雨、月、人), is characters. In typography, phonograms, signs, symbols, and logograms may all be classified as characters.
\ No newline at end of file
-The rag refers to the irregular edge of an unjustified text block. “Ragged right” is another term for left-justified text, and “ragged left” means right-justified.
+The rag refers to the irregular edge of an [unjustified](/glossary/alignment_justification) [text](/glossary/text_copy) block. “Ragged right” is another term for left-justified text, and “ragged left” means right-justified.
<figure>
</figure>
-Center-aligned type has two rags: both left and right. Fully justified text has no rag, since glyphs touch both the right and left sides of the text block.
+Center-aligned [type](/glossary/type) has two rags: both left and right. Fully justified text has no rag, since glyphs touch both the right and left sides of the text block.
-When a typographic change is made to text—such as increasing the font size, switching to a different weight, or moving to an entirely new font—it’s likely the lines of type will re-flow; that is, words that were set on one line prior to the change may then move to the line above or below.
+When a [typographic change](/glossary/typography) is made to [text](/glossary/text_copy)—such as increasing the [font](/glossary/font) size, switching to a different [weight](/glossary/weight), or moving to an entirely new font—it’s likely the lines of [type](/glossary/type) will re-flow; that is, words that were set on one line prior to the change may then move to the line above or below.
In print, when a document has already been edited and designed, reflow can be problematic, such as text being cropped from the page when it no longer fits in its containing block.
-When a character is not present in a font, and no fallback option is available, the missing character is replaced with a symbol that has come to be known as “tofu” due to its resemblance to a block of tofu.
+When a [character](/glossary/character) is not present in a [font](/glossary/font), and no fallback option is available, the missing character is replaced with a symbol that has come to be known as “tofu” due to its resemblance to a block of tofu.
<figure>
Software for general use, such as web browsers and Microsoft Word, use font fallback systems to make tofu rare. Professional applications, such as Adobe Creative Cloud suite, inform users when a character is not available in the selected font.
-Tofu should be avoided at all costs and is arguably worse than no text appearing at all, because it makes the text inaccessible and the author or brand appear unprofessional. The Noto fonts (“no tofu”) are an attempt to provide fonts for as many writing systems as possible, whether as the intended fonts or as fallback fonts.
+Tofu should be avoided at all costs and is arguably worse than no text appearing at all, because it makes the [text](/glossary/text_copy) inaccessible and the author or brand appear unprofessional. The [Noto fonts](https://fonts.google.com/noto/fonts) (“no tofu”) are an attempt to provide fonts for as many [writing systems](/glossary/script_writing_system) as possible, whether as the intended fonts or as fallback fonts.
-name: "An Alphabet for Reading and Writing"
+name: "An alphabet for reading and writing"
authors: "Darrell Penta"
reviewers: "Cassidy Curtis"
reviewers: "Minjoo Ham"
reviewers: "Min-Young Kim"
reviewers: "SeHee Lee"
topics: "hangeul"
+topics: "type_history"
prev_lessons: "making_the_details_matter"
next_lessons: "lessons_from_hangeul"
related_terms: "alphabet"
reviewers: "Min-Young Kim"
reviewers: "SeHee Lee"
topics: "hangeul"
+topics: "type_history"
next_lessons: "designing_for_learnability"
related_terms: "alphabet"
related_terms: "letters"
-name: "Designing for Learnability"
+name: "Designing for learnability"
authors: "Darrell Penta"
reviewers: "Cassidy Curtis"
reviewers: "Minjoo Ham"
reviewers: "Min-Young Kim"
reviewers: "SeHee Lee"
topics: "hangeul"
+topics: "type_history"
prev_lessons: "an_introduction_to_hangeul"
next_lessons: "making_the_details_matter"
related_terms: "alphabet"
reviewers: "Min-Young Kim"
reviewers: "SeHee Lee"
topics: "hangeul"
+topics: "type_history"
prev_lessons: "an_alphabet_for_reading_and_writing"
related_terms: "alphabet"
related_terms: "letters"
-name: "Making the Details Matter"
+name: "Making the cetails matter"
authors: "Darrell Penta"
reviewers: "Cassidy Curtis"
reviewers: "Minjoo Ham"
reviewers: "Min-Young Kim"
reviewers: "SeHee Lee"
topics: "hangeul"
+topics: "type_history"
prev_lessons: "designing_for_learnability"
next_lessons: "an_alphabet_for_reading_and_writing"
related_terms: "alphabet"
-name: "Hangeul"
+name: "Designing Hangeul"
lessons: "an_introduction_to_hangeul"
lessons: "designing_for_learnability"
lessons: "making_the_details_matter"
[Color fonts](/glossary/color_fonts) (also known as chromatic fonts) can use multiple colors, including gradients, in a single glyph, rather than the flat, single color used by typical, non-color (monochromatic) fonts. This relatively new technology allows designers to set the color palette within the font to express themselves with color in a way that would previously not be possible outside of advanced graphics applications.
-[ILLO: color fonts montage]
+
To use a color font from Google Fonts, simply reference the family as you would any other font:
```css
-@import url('https://fonts.googleapis.com/css2?family=Blaka+Ink&display=swap');
-.classname {
- font-family: "Blaka Ink";
+@import url('https://fonts.googleapis.com/css2?family=Nabla&display=swap');
+
+p {
+ font-family: "Nabla";
}
```
-[ILLO showing output of code]
+<figure>
-This should render the font with its default color values, which are contained within the font file itself. At the time of writing, browser support for color fonts is not yet universal. This means that the type should always be rendered, but the colors or variable font axes may not appear as intended in browsers that don’t support the [COLRv1](https://caniuse.com/colr-v1) standard. However, thankfully the Google Fonts API supports these browsers with SVG fonts and attempts to get as close to the original intent as possible. You can read more about this implementation at [INSERT].
+
-The type designer has the power to include not just one, but a whole set of default color palettes within the font file. We can make use of these with the base-palette declaration, as in this example, where we select the a particular palette option:
+</figure>
-```css
-.classname {
- base-palette: 4;
- }
-```
+This should render the font with its default color values, which are contained within the font file itself. At the time of writing, browser support for color fonts is not yet universal. This means that the type should always be rendered, but the colors or variable font axes may not appear as intended in browsers that don’t support the [COLRv1](https://caniuse.com/colr-v1) standard. However, the Google Fonts API supports these browsers with SVG fonts and attempts to get as close to the original intent as possible. You can read more about this implementation on [“COLRv1 Color Gradient Vector Fonts in Chrome 98.”](https://developer.chrome.com/blog/colrv1-fonts/)
-[ILLO showing output of code]
-
-[FRO: see also https://codepen.io/jh3y/pen/XWqNoEV]
-
-The number 4 here is the index ID of the fifth (numbering starts at 0) color palette provided by the font itself.
-Of course, if we wish to use colors not defined by the type designer in the base palettes, we can completely customize them ourselves using the [`override-colors`](https://caniuse.com/mdn-css_at-rules_font-palette-values_override-colors) property:
+The type designer has the power to include not just one, but a whole set of default color palettes within the font file. We can make use of these with the `base-palette` declaration, as in this example, where we select the the 3rd palette option:
```css
-.classname {
- base-palette: 4;
- override-colors: 0 #00ffbb, 1 #007744, 2 #004433;
- }
+p {
+ font-family: "Nabla";
+ font-palette: --myPalette;
+}
+
+@font-palette-values --myPalette {
+ font-family: "Nabla";
+ base-palette: 3;
+}
```
-The numbers 0, 1, and 2 here are the index IDs for the color swatches within the palette.
+<figure>
+
+
+
+</figure>
-[ILLO showing output of code]
+The number 3 here is the index ID of the 3rd color palette provided by the font itself. (Note that numbering starts at 0.) Of course, if we wish to use colors not defined by the type designer in the base palettes, we can completely customize them ourselves using the [`override-colors`](https://caniuse.com/mdn-css_at-rules_font-palette-values_override-colors) property, or even choose to just override one at a time.
-Most people will first encounter color fonts via emoji, and emoji is a great example of how gradients can provide even more expression over flat color. In this example, let’s use CSS to turn a simple smiley purple and blue:
+The Nabla font contains multiple index IDs for the color swatches within its palette. Here, we’re using the 3rd base palette and just changing the 6th color swatch:
```css
-INSERT CSS HERE
+@font-palette-values --myPalette {
+ font-family: "Nabla";
+ base-palette: 3;
+ override-colors: 6 #FFB978;
+}
```
-[ILLO showing output of code]
+<figure>
+
+
+
+</figure>
-Google Fonts now supports a growing number of color fonts in its library, which can be found at [fonts.google.com](https://fonts.google.com/?coloronly=true). For more information on color fonts, please read this introductory post on the Chrome Developers blog, COLRv1 Color Gradient Vector Fonts in Chrome 98.
\ No newline at end of file
+Google Fonts now supports a growing number of color fonts in its library. To narrow the library selection to color fonts, visit [fonts.google.com/?coloronly=true](https://fonts.google.com/?coloronly=true) or press the “Show only color fonts” toggle.
-<svg width="1920" height="1080" fill="none" xmlns="http://www.w3.org/2000/svg">
-<!-- TODO: a real thumbnail -->
-</svg>
\ No newline at end of file
+<svg width="1920" height="1080" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="m176.989 416.976-63.995 36.77L49 416.976l63.994-36.77 63.995 36.77Zm127.253-51.479c-12.75-7.354-27.707-6.128-44.87 3.677l-19.125 11.032c-11.278 6.373-21.699 15.811-31.261 28.313-9.562 12.502-17.286 25.984-23.17 40.447-5.885 14.463-8.827 28.313-8.827 41.55l-63.995-36.77c0-13.237 2.943-27.087 8.827-41.55 5.885-14.463 13.731-27.946 23.538-40.448 9.808-12.502 20.351-21.939 31.63-28.313l18.389-11.031c17.163-9.805 32.12-11.031 44.869-3.677l63.995 36.77Zm-191.248 88.249v397.12L49 814.095V416.976l63.994 36.77Zm337.626-172.82c-12.75-7.354-27.707-6.129-44.87 3.677l-19.125 11.031c-11.278 6.373-21.699 15.811-31.261 28.313-9.563 12.502-17.286 25.984-23.171 40.447-5.884 14.463-8.826 28.313-8.826 41.551l-63.995-36.771c0-13.237 2.942-27.087 8.827-41.55 5.885-14.463 13.731-27.945 23.538-40.447 9.808-12.502 20.351-21.94 31.63-28.314l19.124-11.031c16.673-9.805 31.385-11.031 44.134-3.677l63.995 36.771ZM259.372 442.715v323.579l-63.994-36.77V405.945l63.994 36.77Zm146.378-84.572v323.579l-63.259-36.77V321.373l63.259 36.77Zm-292.756 95.603 63.995-36.77v73.54c0-13.237 2.942-27.087 8.827-41.55 5.884-14.463 13.608-27.945 23.17-40.447 9.562-12.502 19.983-21.94 31.261-28.313l19.125-11.032c17.163-9.805 32.12-11.031 44.87-3.677 12.75 7.354 19.125 20.837 19.125 40.448 0-13.238 2.942-27.088 8.826-41.551 5.885-14.463 13.608-27.945 23.171-40.447 9.562-12.502 19.983-21.94 31.261-28.313l19.125-11.031c17.163-9.806 32.12-11.031 44.87-3.677 12.75 7.354 19.124 20.836 19.124 40.447v323.579l-63.994 36.77V358.143l-82.383 47.802v323.579l-63.995 36.77V442.715l-82.383 47.801v323.579l-63.995 36.771v-397.12Z" fill="#FFD215"/><path d="M405.751 358.143v323.579l-63.259-36.77V321.373l63.259 36.77Z" fill="url(#b)"/><path d="M259.371 442.715v323.579l-63.994-36.77V405.945l63.994 36.77Z" fill="url(#c)"/><path d="M450.621 280.926c-12.75-7.354-27.707-6.129-44.87 3.677l-19.125 11.031c-11.279 6.373-21.699 15.811-31.261 28.313-9.563 12.502-17.286 25.984-23.171 40.447-5.884 14.463-8.827 28.313-8.827 41.551l-63.994-36.771c0-13.237 2.942-27.087 8.827-41.55 5.884-14.463 13.73-27.945 23.538-40.447 9.808-12.502 20.351-21.94 31.629-28.314l19.125-11.031c16.673-9.805 31.384-11.031 44.134-3.677l63.995 36.771Z" fill="url(#d)"/><path d="M112.994 453.746v397.12L49 814.096v-397.12l63.994 36.77Z" fill="url(#e)"/><path d="M304.242 365.497c-12.75-7.354-27.707-6.128-44.87 3.677l-19.125 11.032c-11.278 6.373-21.699 15.811-31.261 28.313-9.563 12.502-17.286 25.984-23.171 40.447-5.884 14.463-8.827 28.313-8.827 41.551l-63.994-36.771c0-13.237 2.942-27.087 8.827-41.55 5.884-14.463 13.731-27.946 23.538-40.448 9.808-12.502 20.351-21.939 31.629-28.313l18.39-11.031c17.163-9.805 32.119-11.031 44.869-3.677l63.995 36.77Z" fill="url(#f)"/><path d="m176.989 416.976-63.995 36.77L49 416.976l63.994-36.77 63.995 36.77Z" fill="url(#g)"/><path d="m112.994 453.746 63.994-36.77v73.541c0-13.238 2.943-27.088 8.827-41.551 5.885-14.463 13.608-27.945 23.171-40.447 9.562-12.502 19.983-21.94 31.261-28.313l19.125-11.031c17.163-9.806 32.12-11.031 44.87-3.677 12.749 7.354 19.124 20.836 19.124 40.447 0-13.237 2.943-27.088 8.827-41.551 5.885-14.463 13.608-27.945 23.171-40.447 9.562-12.502 19.982-21.939 31.261-28.313l19.125-11.031c17.163-9.806 32.12-11.031 44.869-3.677 12.75 7.354 19.125 20.836 19.125 40.447v323.579l-63.994 36.77V358.144l-82.384 47.801v323.579l-63.994 36.77V442.715l-82.384 47.802v323.579l-63.994 36.77v-397.12Z" fill="url(#h)"/><path d="M259.372 369.174c-6.865 1.471-11.769 2.942-14.711 4.413a120.331 120.331 0 0 0-8.091 4.412c-11.279 6.374-21.7 15.811-31.262 28.313-9.562 12.502-17.041 26.23-22.435 41.183-5.394 14.953-7.356 29.294-5.884 43.021.98-12.256 4.658-25.494 11.033-39.712 6.375-14.217 14.466-27.577 24.274-40.079 9.807-12.502 20.351-21.94 31.629-28.313a124.916 124.916 0 0 0 7.356-4.781c2.452-1.715 5.149-4.535 8.091-8.457Zm146.378-84.571c-6.375 1.47-11.156 2.941-14.344 4.412-3.187 1.471-6.007 2.942-8.459 4.412-11.278 6.374-21.699 15.812-31.261 28.314-9.563 12.501-17.041 26.229-22.435 41.182-5.394 14.954-7.356 29.294-5.885 43.022.981-12.257 4.782-25.494 11.402-39.712 6.62-14.218 14.834-27.578 24.641-40.08 9.808-12.502 20.106-21.94 30.894-28.313a124.893 124.893 0 0 0 7.356-4.78c2.452-1.716 5.149-4.535 8.091-8.457ZM176.989 416.976c-18.144 7.844-31.998 14.463-41.56 19.856a25443.365 25443.365 0 0 1-26.113 14.708v84.204c0 29.171.246 63 .736 101.486.49 38.486 1.471 85.185 2.942 140.095 1.471-53.44 2.452-99.035 2.943-136.786.49-37.751.735-71.212.735-100.383v-84.204c7.846-4.412 16.305-9.437 25.377-15.076 9.072-5.638 20.719-13.605 34.94-23.9Z" fill="#fff"/><path d="M832.38 339.758c-12.75-7.354-27.461-6.128-44.134 3.677l-127.253 73.541c-11.279 6.373-21.822 15.811-31.63 28.313-9.807 12.502-17.653 25.984-23.538 40.447-5.884 14.463-8.827 28.314-8.827 41.551v279.454c0 19.611 6.375 33.094 19.125 40.448l-63.994-36.771c-12.75-7.354-19.125-20.836-19.125-40.447V490.517c0-13.238 2.942-27.088 8.827-41.551 5.884-14.463 13.73-27.945 23.538-40.447 9.807-12.502 20.351-21.94 31.629-28.313l127.253-73.541c17.164-9.806 32.12-11.031 44.87-3.677l63.259 36.77Zm-44.134 187.529-127.253 73.54-63.995-36.77 127.253-73.54 63.995 36.77Zm-127.253 73.54c0 19.611 6.375 33.094 19.124 40.448l-63.994-36.77c-12.75-7.355-19.125-20.837-19.125-40.448l63.995 36.77Zm127.253-183.851v110.311l-63.995-36.77V380.206l63.995 36.77Zm63.259 242.684L660.993 769.971l-63.995-36.77L788.246 622.89l63.259 36.77Zm-63.259-242.684-127.253 73.541v110.31l127.253-73.54V416.976Zm-127.253 0 127.253-73.541c16.673-9.805 31.384-11.031 44.134-3.677 12.75 7.354 19.125 20.837 19.125 40.448v110.311c0 12.747-2.943 26.474-8.827 41.182-5.885 14.708-13.608 28.313-23.171 40.815-9.562 12.502-19.983 21.94-31.261 28.313l-63.995 36.771c-16.672 9.805-31.384 11.031-44.134 3.677-12.749-7.354-19.124-20.837-19.124-40.448v169.144L851.505 659.66v73.541L660.993 843.512c-17.164 9.805-32.12 11.031-44.87 3.677-12.75-7.354-19.125-20.837-19.125-40.448V527.287c0-13.237 2.943-27.088 8.827-41.551 5.885-14.463 13.731-27.945 23.538-40.447 9.808-12.502 20.351-21.94 31.63-28.313Z" fill="#FFD215"/><path d="M851.504 659.66 660.992 769.971l-63.994-36.77L788.246 622.89l63.258 36.77Z" fill="url(#i)"/><path d="M788.246 416.976v110.311l-63.994-36.77V380.206l63.994 36.77Z" fill="url(#j)"/><path d="M660.992 600.827c0 19.611 6.375 33.094 19.125 40.448l-63.994-36.771c-12.75-7.354-19.125-20.836-19.125-40.447l63.994 36.77Z" fill="url(#k)"/><path d="m788.246 527.287-127.254 73.541-63.994-36.771 127.253-73.54 63.995 36.77Z" fill="url(#l)"/><path d="M832.38 339.758c-12.75-7.354-27.461-6.128-44.134 3.677l-127.253 73.541c-11.279 6.373-21.822 15.811-31.63 28.313-9.807 12.502-17.653 25.984-23.538 40.447-5.884 14.463-8.827 28.314-8.827 41.551v279.454c0 19.611 6.375 33.094 19.125 40.448l-63.994-36.771c-12.75-7.354-19.125-20.836-19.125-40.447V490.517c0-13.238 2.942-27.088 8.827-41.551 5.884-14.463 13.73-27.945 23.538-40.447 9.807-12.502 20.351-21.94 31.629-28.313l127.253-73.541c17.164-9.806 32.12-11.031 44.87-3.677l63.259 36.77Z" fill="url(#m)"/><path d="m788.246 416.976-127.254 73.541v110.311l127.254-73.541V416.976Zm-127.254 0 127.254-73.541c16.672-9.805 31.384-11.031 44.134-3.677 12.749 7.354 19.124 20.837 19.124 40.448v110.311c0 12.747-2.942 26.474-8.827 41.182-5.884 14.709-13.608 28.314-23.17 40.816-9.562 12.501-19.983 21.939-31.261 28.313l-63.995 36.77c-16.673 9.805-31.384 11.031-44.134 3.677-12.75-7.354-19.125-20.837-19.125-40.447v169.143L851.504 659.66v73.541L660.992 843.512c-17.163 9.805-32.119 11.031-44.869 3.677-12.75-7.354-19.125-20.837-19.125-40.448V527.287c0-13.237 2.942-27.087 8.827-41.55 5.884-14.463 13.73-27.946 23.538-40.448 9.808-12.502 20.351-21.939 31.629-28.313Z" fill="url(#n)"/><path d="M851.504 659.66c-25.499 12.747-45.36 23.043-59.581 30.887a7161.674 7161.674 0 0 0-39.72 22.062c-11.769 6.864-24.519 14.463-38.25 22.798-13.73 8.334-31.384 19.856-52.961 34.564 25.5-12.747 45.36-23.043 59.581-30.887a7296.667 7296.667 0 0 0 39.721-22.062c11.769-6.864 24.396-14.463 37.882-22.798 13.485-8.335 31.261-19.856 53.328-34.564Zm-63.258-316.225c-22.558 11.276-41.683 21.204-57.375 29.784a9763.66 9763.66 0 0 0-40.824 22.43 1358.148 1358.148 0 0 0-33.468 19.12c-11.279 6.374-21.699 15.812-31.262 28.314-9.562 12.502-17.285 25.984-23.17 40.447-5.884 14.463-8.827 28.313-8.827 41.55v72.806c0 25.494.245 54.787.736 87.881.49 33.093 1.471 73.418 2.942 120.974 1.471-46.085 2.452-85.43 2.942-118.033.491-32.603.736-61.529.736-86.778v-72.437c0-13.237 2.942-27.088 8.827-41.551 5.884-14.463 13.73-27.945 23.538-40.447 9.807-12.502 20.351-21.94 31.629-28.313a11371.19 11371.19 0 0 1 51.122-30.152c18.389-10.786 42.541-25.984 72.454-45.595Zm0 73.541c-1.962 26.474-3.065 47.679-3.31 63.612a2893.617 2893.617 0 0 0-.368 44.492 4271.69 4271.69 0 0 0-51.49 30.152c-18.144 10.786-42.172 25.984-72.086 45.595a40243.3 40243.3 0 0 1 56.639-30.151c15.692-8.335 29.3-15.812 40.824-22.43a1737.21 1737.21 0 0 1 33.468-18.753c0-13.728-.122-28.804-.367-45.228-.246-16.424-1.349-38.854-3.31-67.289Z" fill="#fff"/><path d="M947.864 501.548v73.541l-63.995-36.771v-73.54l63.995 36.77Zm63.256-110.311v73.541l-63.256-36.771v-73.54l63.256 36.77Zm64-36.77-64 36.77-63.256-36.77 63.256-36.771 64 36.771Zm-64 183.851v279.455c0 19.61 6.38 33.093 19.13 40.447l-63.262-36.77c-12.75-7.354-19.124-20.837-19.124-40.448V501.548l63.256 36.77Zm0-73.54-63.256 36.77-63.995-36.77 63.995-36.771 63.256 36.771Zm191.25-110.311-63.99 36.77c-11.28 6.373-21.7 15.811-31.27 28.313-9.56 12.502-17.28 25.984-23.17 40.447-5.88 14.463-8.82 28.314-8.82 41.551l-64-36.77c0-13.238 2.94-27.088 8.83-41.551 5.88-14.463 13.73-27.945 23.54-40.447 9.8-12.502 20.35-21.94 31.63-28.313l63.26-36.771 63.99 36.771Zm0 352.995-127.25 73.54-64-36.77 127.26-73.541 63.99 36.771Zm-191.25-169.144-63.256 36.771v-73.541l63.256-36.77v-73.541l64-36.77v147.081c0-13.237 2.94-27.088 8.82-41.551 5.89-14.463 13.61-27.945 23.17-40.447 9.57-12.502 19.99-21.94 31.27-28.313l63.99-36.77v73.54l-127.25 73.541v279.454l127.25-73.54v73.54l-127.25 73.541c-17.17 9.805-32.12 11.031-44.87 3.677-12.75-7.354-19.13-20.837-19.13-40.447V538.318Z" fill="#FFD215"/><path d="m1202.37 707.462-127.25 73.54-64-36.77 127.26-73.541 63.99 36.771Z" fill="url(#o)"/><path d="m1202.37 354.467-63.99 36.77c-11.28 6.373-21.7 15.811-31.27 28.313-9.56 12.502-17.28 25.984-23.17 40.447-5.88 14.463-8.82 28.314-8.82 41.551l-64-36.77c0-13.238 2.95-27.088 8.83-41.551 5.88-14.463 13.73-27.945 23.54-40.447 9.81-12.502 20.35-21.94 31.63-28.313l63.26-36.771 63.99 36.771Z" fill="url(#p)"/><path d="m1011.12 464.778-63.256 36.77-63.995-36.77 63.995-36.771 63.256 36.771Z" fill="url(#q)"/><path d="M1011.12 538.318v279.455c0 19.61 6.38 33.093 19.13 40.447l-63.262-36.77c-12.75-7.354-19.125-20.837-19.125-40.448V501.548l63.257 36.77Z" fill="url(#r)"/><path d="m1075.12 354.467-64 36.77-63.257-36.77 63.257-36.771 64 36.771Z" fill="url(#s)"/><path d="M1011.12 391.237v73.541l-63.257-36.771v-73.54l63.257 36.77Z" fill="url(#t)"/><path d="M947.864 501.548v73.54l-63.995-36.77v-73.541l63.995 36.771Z" fill="url(#u)"/><path d="m1011.12 538.318-63.257 36.771v-73.541l63.257-36.77v-73.541l64-36.77v147.081c0-13.237 2.94-27.087 8.82-41.55 5.89-14.463 13.61-27.946 23.17-40.448 9.57-12.502 19.99-21.939 31.27-28.313l63.99-36.77v73.54l-127.25 73.541v279.455l127.25-73.541v73.541l-127.25 73.54c-17.17 9.806-32.12 11.031-44.87 3.677-12.75-7.354-19.13-20.836-19.13-40.447V538.318Z" fill="url(#v)"/><path d="M1011.12 611.859c-1.96 24.023-3.06 43.389-3.31 58.097-.24 14.708-.37 28.436-.37 41.183s0 27.455.37 42.654c.37 15.198 1.35 36.525 3.31 63.98 1.96-25.004 3.07-44.983 3.31-59.936.25-14.953.37-29.048.37-42.286 0-13.237 0-26.597-.37-41.55-.24-14.953-1.35-35.667-3.31-62.142Zm191.25 95.603c-18.63 8.334-32.86 15.198-42.66 20.591-9.81 5.393-18.88 10.541-27.22 15.444-7.85 4.412-16.06 9.315-24.64 14.708-8.58 5.393-19.49 12.992-32.73 22.798 17.16-7.845 30.4-14.218 39.72-19.121 9.31-4.903 17.65-9.56 25.01-13.973a2546.63 2546.63 0 0 0 26.48-15.811c9.31-5.638 21.33-13.85 36.04-24.636Zm0-352.995c-17.65 7.844-31.38 14.463-41.19 19.856a3054.076 3054.076 0 0 0-26.48 14.708c-11.28 6.373-21.7 15.811-31.26 28.313-9.57 12.502-17.04 26.23-22.44 41.183-5.39 14.953-7.35 29.293-5.88 43.021.98-12.257 4.78-25.494 11.4-39.712 6.62-14.218 14.83-27.578 24.64-40.08 9.81-12.501 20.35-21.939 31.63-28.313 7.84-4.412 16.18-9.437 25.01-15.075 8.82-5.639 20.35-13.606 34.57-23.901Zm-127.25 0c-18.15 7.844-32 14.463-41.56 19.856-9.57 5.393-18.27 10.295-26.12 14.708v73.541c-7.842 4.412-16.301 9.437-25.373 15.075-9.072 5.638-20.473 13.605-34.204 23.901 17.654-8.335 31.262-15.076 40.824-20.224a1637.288 1637.288 0 0 0 26.113-14.34v-73.541c8.34-4.412 16.92-9.437 25.74-15.075 8.83-5.639 20.36-13.606 34.58-23.901Z" fill="#fff"/><path d="M1329.62 453.746v73.541l-63.99-36.77v-73.541l63.99 36.77ZM1565 339.758c-12.74-7.354-27.46-6.128-44.13 3.677l-191.25 110.311-63.99-36.77 191.25-110.311c17.16-9.806 32.12-11.031 44.87-3.677l63.25 36.77Zm-44.13 180.175-127.25 73.54c-11.28 6.374-21.82 15.812-31.63 28.314-9.81 12.501-17.66 25.984-23.54 40.447-5.88 14.463-8.83 28.313-8.83 41.55v102.957c0 19.611 6.38 33.094 19.13 40.448l-64-36.771c-12.75-7.354-19.12-20.836-19.12-40.447V667.014c0-13.237 2.94-27.087 8.83-41.55 5.88-14.463 13.73-27.946 23.53-40.448 9.81-12.502 20.35-21.939 31.63-28.313l127.26-73.541 63.99 36.771Zm0 176.497-127.25 73.541-64-36.77 127.26-73.541 63.99 36.77Zm0-102.957V696.43l-63.99-36.77V556.703l63.99 36.77Zm0 102.957v73.541l-63.99-36.77V659.66l63.99 36.77Zm0-279.454v102.957l-63.99-36.771V380.206l63.99 36.77Zm-127.25 352.995 127.25-73.541V593.473l-127.25 73.541v102.957Zm-64-316.225 191.25-110.311c16.67-9.805 31.39-11.031 44.13-3.677 12.75 7.354 19.13 20.837 19.13 40.448v352.995l-63.26 36.77V696.43c0 12.747-2.94 26.475-8.83 41.183-5.88 14.708-13.73 28.313-23.53 40.815-9.81 12.502-20.35 21.94-31.63 28.313l-63.26 36.771c-17.17 9.805-32.12 11.031-44.87 3.677-12.75-7.354-19.13-20.837-19.13-40.448V703.784c0-13.237 2.95-27.087 8.83-41.55 5.88-14.463 13.73-27.946 23.54-40.447 9.81-12.502 20.35-21.94 31.63-28.314l127.25-73.54V416.976l-191.25 110.311v-73.541Z" fill="#FFD215"/><path d="M1520.87 416.976v102.957l-63.99-36.771V380.206l63.99 36.77Z" fill="url(#w)"/><path d="M1520.87 696.43v73.541l-63.99-36.77V659.66l63.99 36.77Z" fill="url(#x)"/><path d="M1520.87 593.473V696.43l-63.99-36.77V556.703l63.99 36.77Z" fill="url(#y)"/><path d="m1520.87 696.43-127.25 73.541-64-36.77 127.26-73.541 63.99 36.77Z" fill="url(#z)"/><path d="m1520.87 519.933-127.25 73.541c-11.28 6.373-21.82 15.811-31.63 28.313-9.81 12.502-17.66 25.984-23.54 40.447-5.88 14.463-8.83 28.313-8.83 41.551v102.956c0 19.611 6.38 33.094 19.13 40.448l-64-36.771c-12.75-7.354-19.12-20.836-19.12-40.447V667.014c0-13.237 2.94-27.087 8.83-41.55 5.88-14.463 13.73-27.946 23.53-40.448 9.81-12.502 20.35-21.939 31.63-28.313l127.26-73.54 63.99 36.77Z" fill="url(#A)"/><path d="M1565 339.758c-12.74-7.354-27.46-6.128-44.13 3.677l-191.25 110.311-63.99-36.77 191.25-110.311c17.16-9.806 32.12-11.031 44.87-3.677l63.25 36.77Z" fill="url(#B)"/><path d="M1329.62 453.746v73.541l-63.99-36.77v-73.541l63.99 36.77Z" fill="url(#C)"/><path d="m1393.62 769.971 127.25-73.54V593.474l-127.25 73.54v102.957Zm-64-316.225 191.25-110.311c16.67-9.805 31.38-11.031 44.13-3.677 12.75 7.354 19.13 20.837 19.13 40.448v352.995l-63.26 36.77v-73.54c0 12.747-2.94 26.474-8.83 41.182-5.88 14.708-13.73 28.313-23.53 40.815-9.81 12.502-20.36 21.94-31.63 28.313l-63.26 36.771c-17.17 9.805-32.12 11.031-44.87 3.677-12.75-7.354-19.13-20.837-19.13-40.448V703.785c0-13.238 2.95-27.088 8.83-41.551 5.88-14.463 13.73-27.945 23.54-40.447 9.81-12.502 20.35-21.94 31.63-28.313l127.25-73.541V416.976l-191.25 110.311v-73.541Z" fill="url(#D)"/><path d="M1520.87 343.435c-33.35 17.65-61.54 32.848-84.59 45.595-23.05 12.747-43.28 24.024-60.68 33.829-17.41 9.805-33.96 19.366-49.65 28.681 0 9.315 0 19.365.36 30.151.25 10.786 1.35 25.985 3.31 45.596 1.96-17.16 3.07-31.01 3.31-41.551.25-10.541.37-20.469.37-29.784a7772.557 7772.557 0 0 0 50.02-29.048c17.16-10.051 36.66-21.695 58.48-34.932 21.82-13.237 48.18-29.416 79.07-48.537Zm0 250.038c-1.96 24.514-3.06 44.247-3.31 59.2-.24 14.954-.37 28.804-.37 41.551-16.18 9.315-33.34 19.366-51.49 30.152-18.14 10.786-42.17 25.984-72.08 45.595 22.06-11.767 40.94-21.817 56.64-30.152 15.69-8.335 29.3-15.811 40.82-22.43a1729.941 1729.941 0 0 1 33.47-18.753c0-12.747 0-26.719-.37-41.918-.24-15.198-1.35-36.28-3.31-63.245Zm0-176.497c-1.96 24.513-3.06 44.247-3.31 59.2-.24 14.953-.37 28.803-.37 41.55l-127.99 73.541c-11.27 6.374-21.7 15.811-31.26 28.313-9.56 12.502-17.28 25.985-23.17 40.448-5.88 14.462-8.82 28.313-8.82 41.55 0 10.296 0 21.327.36 33.093.25 11.767 1.35 28.436 3.31 50.008 1.96-19.121 3.07-34.442 3.31-45.963.25-11.521.37-22.43.37-32.726 0-13.237 2.94-27.087 8.83-41.55 5.88-14.463 13.73-27.945 23.54-40.447 9.8-12.502 20.35-21.94 31.63-28.314l127.25-73.54c0-12.747 0-26.72-.37-41.918-.37-15.199-1.35-36.28-3.31-63.245Z" fill="#fff"/><path d="M1712.12 262.541v544.2c0 19.611 6.37 33.094 19.12 40.448l-63.99-36.771c-12.75-7.354-19.13-20.836-19.13-40.447V225.77l64 36.771ZM1871 714.816l-94.89 55.155-63.99-36.77 95.62-55.156 63.26 36.771Zm-94.89-489.046-63.99 36.771-64-36.771 64-36.77 63.99 36.77Zm0 544.201 94.89-55.155v73.54l-94.89 55.156c-17.16 9.805-32.12 11.031-44.87 3.677-12.75-7.354-19.12-20.837-19.12-40.448v-544.2l63.99-36.771v544.201Z" fill="#FFD215"/><path d="m1776.11 225.77-63.99 36.771-64-36.771 64-36.77 63.99 36.77Z" fill="url(#E)"/><path d="m1871 714.816-94.89 55.155-63.99-36.77 95.62-55.156 63.26 36.771Z" fill="url(#F)"/><path d="M1712.12 262.541v544.201c0 19.61 6.37 33.093 19.12 40.447l-63.99-36.77c-12.75-7.354-19.13-20.837-19.13-40.448v-544.2l64 36.77Z" fill="url(#G)"/><path d="m1776.11 769.971 94.89-55.155v73.54l-94.89 55.156c-17.16 9.805-32.12 11.031-44.87 3.677-12.75-7.354-19.12-20.837-19.12-40.447V262.541l63.99-36.77v544.2Z" fill="url(#H)"/><path d="M1871 714.816c-12.75 5.393-22.56 9.805-29.42 13.237-6.87 3.432-13 6.864-18.39 10.296-6.38 3.432-13.12 7.476-20.23 12.134-7.11 4.658-16.06 11.154-26.85 19.488 14.22-6.373 25.26-11.644 33.1-15.811 7.85-4.167 14.96-7.967 21.33-11.399 5.4-3.432 11.28-7.109 17.66-11.031 6.37-3.922 13.97-9.56 22.8-16.914Zm-94.89-489.045c-18.14 7.844-32 14.463-41.56 19.855-9.56 5.393-18.26 10.296-26.11 14.709v104.427c0 35.79 0 74.767.37 116.93.24 42.163.61 89.72 1.1 142.669.49 52.949 1.23 113.743 2.21 182.381.98-67.658 1.71-127.593 2.2-179.807.49-52.214.86-99.28 1.11-141.198.24-41.918.37-80.772.37-116.562V264.747c7.84-4.412 16.3-9.438 25.37-15.076s20.72-13.605 34.94-23.9Z" fill="#fff"/></g><defs><linearGradient id="b" x1="307.078" y1="626.731" x2="447.501" y2="384.534" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="c" x1="159.32" y1="710.208" x2="299.743" y2="468.011" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="d" x1="307.334" y1="399.183" x2="380.742" y2="272.57" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".13" stop-color="#F3993A"/><stop offset=".37" stop-color="#F6B460"/><stop offset=".7" stop-color="#FBDF9E"/><stop offset=".87" stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="e" x1="-2.166" y1="785.158" x2="170.165" y2="487.926" gradientUnits="userSpaceOnUse"><stop stop-color="#EA5636"/><stop offset="1" stop-color="#F28F2C"/></linearGradient><linearGradient id="f" x1="4993.55" y1="-7846.29" x2="5066.96" y2="-7972.9" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".13" stop-color="#F3993A"/><stop offset=".37" stop-color="#F6B460"/><stop offset=".7" stop-color="#FBDF9E"/><stop offset=".87" stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="g" x1="96.991" y1="444.188" x2="128.899" y2="389.153" gradientUnits="userSpaceOnUse"><stop stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="h" x1="353.347" y1="690.131" x2="162.738" y2="358.444" gradientUnits="userSpaceOnUse"><stop stop-color="#FFD316"/><stop offset=".29" stop-color="#FFD92B"/><stop offset=".88" stop-color="#FFE862"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="i" x1="673.736" y1="784.61" x2="772.659" y2="613.99" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".2" stop-color="#F39C35"/><stop offset=".59" stop-color="#F8BF4E"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="j" x1="3887.62" y1="-4933.63" x2="784.111" y2="419.211" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="k" x1="1476.23" y1="-832.101" x2="647.563" y2="597.157" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="l" x1="5702.61" y1="-8082.13" x2="5779.21" y2="-8214.25" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".2" stop-color="#F39C35"/><stop offset=".59" stop-color="#F8BF4E"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="m" x1="516.107" y1="753.999" x2="764.981" y2="324.746" gradientUnits="userSpaceOnUse"><stop stop-color="#EA5636"/><stop offset=".49" stop-color="#F28F2C"/><stop offset=".52" stop-color="#F3993A"/><stop offset=".6" stop-color="#F6B460"/><stop offset=".69" stop-color="#FBDF9E"/><stop offset=".74" stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="n" x1="-11752" y1="-21107.7" x2="-11942.6" y2="-21439.4" gradientUnits="userSpaceOnUse"><stop stop-color="#FFD316"/><stop offset=".29" stop-color="#FFD92B"/><stop offset=".88" stop-color="#FFE862"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="o" x1="5899.3" y1="-7529.36" x2="5972.71" y2="-7655.98" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".2" stop-color="#F39C35"/><stop offset=".59" stop-color="#F8BF4E"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="p" x1="1053.38" y1="487.818" x2="1149.1" y2="322.713" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".14" stop-color="#F39C35"/><stop offset=".39" stop-color="#F8BF4E"/><stop offset=".67" stop-color="#FFEC6F"/><stop offset=".79" stop-color="#FEEF89"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="q" x1="930.62" y1="488.174" x2="984.846" y2="394.647" gradientUnits="userSpaceOnUse"><stop stop-color="#FEF7C0"/><stop offset=".25" stop-color="#FADA97"/><stop offset=".76" stop-color="#F4A44A"/><stop offset="1" stop-color="#F28F2C"/></linearGradient><linearGradient id="r" x1="934.47" y1="769.582" x2="1055.71" y2="560.47" gradientUnits="userSpaceOnUse"><stop stop-color="#EA5636"/><stop offset=".47" stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="s" x1="995.413" y1="381.802" x2="1027.32" y2="326.767" gradientUnits="userSpaceOnUse"><stop stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="t" x1="963.489" y1="436.834" x2="995.398" y2="381.799" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#F28F2C"/></linearGradient><linearGradient id="u" x1="900.192" y1="547.216" x2="932.101" y2="492.181" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#F28F2C"/></linearGradient><linearGradient id="v" x1="-11369.5" y1="-21107.7" x2="-11560.1" y2="-21439.4" gradientUnits="userSpaceOnUse"><stop stop-color="#FFD316"/><stop offset=".29" stop-color="#FFD92B"/><stop offset=".88" stop-color="#FFE862"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="w" x1="4410.75" y1="-4578.51" x2="1514.41" y2="417.023" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="x" x1="3237.55" y1="-2298.78" x2="1500.55" y2="697.167" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="y" x1="4403.76" y1="-4485.35" x2="1513.54" y2="586.978" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#EA5636"/></linearGradient><linearGradient id="z" x1="6435.23" y1="-7912.99" x2="6511.84" y2="-8045.11" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".2" stop-color="#F39C35"/><stop offset=".59" stop-color="#F8BF4E"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="A" x1="1288.78" y1="784.121" x2="1461.11" y2="486.889" gradientUnits="userSpaceOnUse"><stop stop-color="#EA5636"/><stop offset=".26" stop-color="#F28F2C"/><stop offset=".63" stop-color="#F28F2C"/><stop offset=".71" stop-color="#F39C35"/><stop offset=".85" stop-color="#F8BF4E"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="B" x1="1362.23" y1="471.238" x2="1457.95" y2="306.133" gradientUnits="userSpaceOnUse"><stop stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="C" x1="1281.7" y1="499.219" x2="1313.6" y2="444.184" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset="1" stop-color="#F28F2C"/></linearGradient><linearGradient id="D" x1="-11019.4" y1="-21107.7" x2="-11210" y2="-21439.4" gradientUnits="userSpaceOnUse"><stop stop-color="#FFD316"/><stop offset=".29" stop-color="#FFD92B"/><stop offset=".88" stop-color="#FFE862"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="E" x1="1696.11" y1="252.982" x2="1728.02" y2="197.947" gradientUnits="userSpaceOnUse"><stop stop-color="#FEF7C0"/><stop offset="1" stop-color="#FEF7C0"/></linearGradient><linearGradient id="F" x1="5952.06" y1="-6449.73" x2="6015.87" y2="-6559.8" gradientUnits="userSpaceOnUse"><stop stop-color="#F28F2C"/><stop offset=".2" stop-color="#F39C35"/><stop offset=".59" stop-color="#F8BF4E"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><linearGradient id="G" x1="1580.73" y1="730.614" x2="1816.87" y2="323.312" gradientUnits="userSpaceOnUse"><stop stop-color="#EA5636"/><stop offset="1" stop-color="#F28F2C"/></linearGradient><linearGradient id="H" x1="-10680" y1="-21082.9" x2="-10870.6" y2="-21414.6" gradientUnits="userSpaceOnUse"><stop stop-color="#FFD316"/><stop offset=".29" stop-color="#FFD92B"/><stop offset=".88" stop-color="#FFE862"/><stop offset="1" stop-color="#FFEC6F"/></linearGradient><clipPath id="a"><path fill="#fff" transform="translate(49 189)" d="M0 0h1822v674H0z"/></clipPath></defs></svg>
\ No newline at end of file
reviewers: "Elliot Jay Stocks"
reviewers: "Cosimo Lupo"
topics: "color_fonts"
-# TODO do we have prev_lessons, next_lessons, or related_terms?
+prev_lessons: "introducing_alternate_glyphs"
+next_lessons: "introducing_variable_fonts"
excerpt: "Color fonts allow the font to use many colors and to have an opinion about what those colors should be."