[{"data":1,"prerenderedAt":1626},["ShallowReactive",2],{"navigation_docs":3,"-get-started-providers":38,"-get-started-providers-surround":1621},[4,30,34],{"title":5,"path":6,"stem":7,"children":8,"page":29},"Getting Started","\u002Fget-started","1.get-started",[9,13,17,21,25],{"title":10,"path":11,"stem":12},"Installation","\u002Fget-started\u002Finstallation","1.get-started\u002F1.installation",{"title":14,"path":15,"stem":16},"Configuration","\u002Fget-started\u002Fconfiguration","1.get-started\u002F2.configuration",{"title":18,"path":19,"stem":20},"Usage","\u002Fget-started\u002Fusage","1.get-started\u002F3.usage",{"title":22,"path":23,"stem":24},"Providers","\u002Fget-started\u002Fproviders","1.get-started\u002F4.providers",{"title":26,"path":27,"stem":28},"Upgrade Guide","\u002Fget-started\u002Fupgrade","1.get-started\u002F5.upgrade",false,{"title":31,"path":32,"stem":33},"Advanced","\u002Fadvanced","2.advanced",{"title":35,"path":36,"stem":37},"Contributing","\u002Fcontributing","3.contributing",{"id":39,"title":22,"body":40,"description":1615,"extension":1616,"links":1617,"meta":1618,"navigation":1203,"path":23,"seo":1619,"stem":24,"__hash__":1620},"docs\u002F1.get-started\u002F4.providers.md",{"type":41,"value":42,"toc":1602},"minimark",[43,48,52,59,84,133,138,157,178,338,342,368,384,401,444,453,457,469,610,623,634,742,747,756,761,769,774,788,793,801,807,812,820,824,856,863,877,893,1031,1036,1044,1047,1142,1145,1150,1154,1164,1170,1444,1451,1598],[44,45,47],"h2",{"id":46},"built-in-providers","Built-In Providers",[49,50,51],"p",{},"Nuxt Fonts ships with a number of built-in providers.",[53,54,56],"h3",{"id":55},"local",[57,58,55],"code",{},[49,60,61,62,65,66,69,70,69,73,69,76,79,80,83],{},"The local provider deeply scans your ",[57,63,64],{},"public\u002F"," directories (including of your layers) for font files (supporting ",[57,67,68],{},"ttf",", ",[57,71,72],{},"woff",[57,74,75],{},"woff2",[57,77,78],{},"eot"," or ",[57,81,82],{},"otf"," extensions).",[49,85,86,87,90,91,94,95,98,99,102,103,106,107,110,111,114,115,118,119,121,122,125,126,128,129,132],{},"Then, when you use a ",[57,88,89],{},"font-family"," in your CSS, we check to see whether it matches one of these files. By default, we expect the font file to be the ",[57,92,93],{},"400"," weight, ",[57,96,97],{},"normal"," style, and ",[57,100,101],{},"latin"," subset. To indicate different weights and styles, please include that information in the filename. For example ",[57,104,105],{},"comic-sans-ms.woff2"," (400\u002Fnormal\u002Flatin; defaults), ",[57,108,109],{},"comic-sans-ms-700-italic-cyrillic.woff2"," (700\u002Fitalic\u002Fcyrillic), or for variable fonts ",[57,112,113],{},"comic-sans-ms-100-900.woff2"," (100 900\u002Fnormal\u002Flatin). Named weights are accepted in place of a weight number: ",[57,116,117],{},"comic-sans-ms-bold.woff2",". ",[57,120,89],{}," values with spaces and\u002For caps will lookup hyphenated lowercase filenames as well, eg ",[57,123,124],{},"font-family: 'Comic Sans MS'"," will look for ",[57,127,105],{}," as well as ",[57,130,131],{},"Comic\\ Sans\\ MS.woff2"," on disk.",[134,135,137],"h4",{"id":136},"named-weights","Named weights",[49,139,140,141,144,145,148,149,152,153,156],{},"The following names are recognised, both in filenames and in the ",[57,142,143],{},"weights"," you configure. Hyphenated and unhyphenated spellings are equivalent, so ",[57,146,147],{},"comic-sans-ms-semibold.woff2"," and ",[57,150,151],{},"comic-sans-ms-semi-bold.woff2"," both resolve to ",[57,154,155],{},"600",".",[49,158,159,148,161,164,165,167,168,171,172,174,175,177],{},[57,160,97],{},[57,162,163],{},"regular"," are only read from your configuration. A file is ",[57,166,93],{}," unless its name says otherwise, and a trailing word is dropped when looking for the family, so ",[57,169,170],{},"comic-sans-ms-regular.woff2"," resolves ",[57,173,124],{}," at ",[57,176,93],{}," regardless.",[179,180,181,194],"table",{},[182,183,184],"thead",{},[185,186,187,191],"tr",{},[188,189,190],"th",{},"Weight",[188,192,193],{},"Names",[195,196,197,213,234,246,258,270,290,302,323],"tbody",{},[185,198,199,205],{},[200,201,202],"td",{},[57,203,204],{},"100",[200,206,207,69,210],{},[57,208,209],{},"thin",[57,211,212],{},"hairline",[185,214,215,220],{},[200,216,217],{},[57,218,219],{},"200",[200,221,222,69,225,69,228,69,231],{},[57,223,224],{},"extra-light",[57,226,227],{},"extralight",[57,229,230],{},"ultra-light",[57,232,233],{},"ultralight",[185,235,236,241],{},[200,237,238],{},[57,239,240],{},"300",[200,242,243],{},[57,244,245],{},"light",[185,247,248,252],{},[200,249,250],{},[57,251,93],{},[200,253,254,69,256],{},[57,255,97],{},[57,257,163],{},[185,259,260,265],{},[200,261,262],{},[57,263,264],{},"500",[200,266,267],{},[57,268,269],{},"medium",[185,271,272,276],{},[200,273,274],{},[57,275,155],{},[200,277,278,69,281,69,284,69,287],{},[57,279,280],{},"semi-bold",[57,282,283],{},"semibold",[57,285,286],{},"demi-bold",[57,288,289],{},"demibold",[185,291,292,297],{},[200,293,294],{},[57,295,296],{},"700",[200,298,299],{},[57,300,301],{},"bold",[185,303,304,309],{},[200,305,306],{},[57,307,308],{},"800",[200,310,311,69,314,69,317,69,320],{},[57,312,313],{},"extra-bold",[57,315,316],{},"extrabold",[57,318,319],{},"ultra-bold",[57,321,322],{},"ultrabold",[185,324,325,330],{},[200,326,327],{},[57,328,329],{},"900",[200,331,332,69,335],{},[57,333,334],{},"black",[57,336,337],{},"heavy",[134,339,341],{"id":340},"variable-fonts","Variable fonts",[49,343,344,345,69,348,79,351,354,355,357,358,360,361,364,365,367],{},"A filename can declare a variable weight range as two CSS weights, separated by a space, hyphen or dot: ",[57,346,347],{},"my-font-100 900.woff2",[57,349,350],{},"my-font-100-900.woff2",[57,352,353],{},"my-font.100-900.woff2"," are all read as covering ",[57,356,204],{}," to ",[57,359,329],{},". Both bounds have to be recognised weights (a multiple of 100 between 100 and 900) in ascending order, so ",[57,362,363],{},"my-font-300-234987akd.woff2"," is still read as a single ",[57,366,240],{}," weight.",[49,369,370,371,373,374,69,377,148,380,383],{},"Such a file will be used for any weight or weight range inside the declared range, so ",[57,372,350],{}," matches ",[57,375,376],{},"weights: [400]",[57,378,379],{},"weights: ['400 700']",[57,381,382],{},"weights: ['100 900']"," alike.",[49,385,386,387,148,390,393,394,396,397,400],{},"When no file covers the whole of a requested range, the endpoints of that range are looked up as static weights instead, so a project shipping ",[57,388,389],{},"my-font.woff2",[57,391,392],{},"my-font-bold.woff2"," resolves the default ",[57,395,379],{}," as two separate ",[57,398,399],{},"@font-face"," rules.",[49,402,403,404,69,407,410,411,414,415,418,419,357,421,423,424,427,428,148,431,434,435,427,438,148,441,156],{},"Files marked as variable without a range (",[57,405,406],{},"my-font-variable.woff2",[57,408,409],{},"my-font-vf.woff2",", or a camel-cased ",[57,412,413],{},"MyFontVariable.woff2"," \u002F ",[57,416,417],{},"MyFontVF.woff2",") are treated as covering the full ",[57,420,204],{},[57,422,329],{}," range. The marker is also treated as part of the family name, so ",[57,425,426],{},"faro-variable.woff2"," matches both ",[57,429,430],{},"font-family: 'Faro Variable'",[57,432,433],{},"font-family: 'Faro'",", and ",[57,436,437],{},"CalSansVF.woff2",[57,439,440],{},"font-family: 'CalSansVF'",[57,442,443],{},"font-family: 'CalSans'",[445,446,448,449,156],"warning",{"to":447},"\u002Fget-started\u002Fconfiguration#font-options","Please note that the local provider will only attempt to load styles and weights that were configured in the ",[450,451,452],"em",{},"Font Options",[134,454,456],{"id":455},"fonts-installed-from-npm","Fonts installed from npm",[49,458,459,460,468],{},"Some fonts are distributed as npm packages containing bare font files, with no stylesheet for the ",[461,462,464,467],"a",{"href":463},"#npm",[57,465,466],{},"npm"," provider"," to read. If one of these is installed, it is scanned automatically and needs no configuration:",[470,471,476],"pre",{"className":472,"code":473,"language":474,"meta":475,"style":475},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n  modules: ['@nuxt\u002Ffonts'],\n  fonts: {\n    families: [\n      { name: 'Geist', provider: 'local' },\n    ],\n  }\n})\n","ts","",[57,477,478,502,530,541,552,587,595,601],{"__ignoreMap":475},[479,480,483,487,490,494,498],"span",{"class":481,"line":482},"line",1,[479,484,486],{"class":485},"s7zQu","export",[479,488,489],{"class":485}," default",[479,491,493],{"class":492},"s2Zo4"," defineNuxtConfig",[479,495,497],{"class":496},"sTEyZ","(",[479,499,501],{"class":500},"sMK4o","{\n",[479,503,505,509,512,515,518,522,524,527],{"class":481,"line":504},2,[479,506,508],{"class":507},"swJcz","  modules",[479,510,511],{"class":500},":",[479,513,514],{"class":496}," [",[479,516,517],{"class":500},"'",[479,519,521],{"class":520},"sfazB","@nuxt\u002Ffonts",[479,523,517],{"class":500},[479,525,526],{"class":496},"]",[479,528,529],{"class":500},",\n",[479,531,533,536,538],{"class":481,"line":532},3,[479,534,535],{"class":507},"  fonts",[479,537,511],{"class":500},[479,539,540],{"class":500}," {\n",[479,542,544,547,549],{"class":481,"line":543},4,[479,545,546],{"class":507},"    families",[479,548,511],{"class":500},[479,550,551],{"class":496}," [\n",[479,553,555,558,561,563,566,569,571,574,576,578,580,582,584],{"class":481,"line":554},5,[479,556,557],{"class":500},"      {",[479,559,560],{"class":507}," name",[479,562,511],{"class":500},[479,564,565],{"class":500}," '",[479,567,568],{"class":520},"Geist",[479,570,517],{"class":500},[479,572,573],{"class":500},",",[479,575,467],{"class":507},[479,577,511],{"class":500},[479,579,565],{"class":500},[479,581,55],{"class":520},[479,583,517],{"class":500},[479,585,586],{"class":500}," },\n",[479,588,590,593],{"class":481,"line":589},6,[479,591,592],{"class":496},"    ]",[479,594,529],{"class":500},[479,596,598],{"class":481,"line":597},7,[479,599,600],{"class":500},"  }\n",[479,602,604,607],{"class":481,"line":603},8,[479,605,606],{"class":500},"}",[479,608,609],{"class":496},")\n",[49,611,612,613,171,616,619,620,622],{},"Filenames still drive weight, style and subset detection, so ",[57,614,615],{},"Geist-Bold.woff2",[57,617,618],{},"font-family: Geist"," at weight ",[57,621,296],{},". Matched fonts are emitted as build assets and served from your own origin.",[49,624,625,626,629,630,633],{},"For a package that is not scanned automatically, add it with ",[57,627,628],{},"packages",", or point at a directory directly with ",[57,631,632],{},"dirs"," (relative paths are resolved from your project root):",[470,635,637],{"className":472,"code":636,"language":474,"meta":475,"style":475},"export default defineNuxtConfig({\n  modules: ['@nuxt\u002Ffonts'],\n  fonts: {\n    local: {\n      packages: ['my-font-package'],\n      dirs: ['assets\u002Ffonts'],\n    },\n  }\n})\n",[57,638,639,651,669,677,686,706,726,731,735],{"__ignoreMap":475},[479,640,641,643,645,647,649],{"class":481,"line":482},[479,642,486],{"class":485},[479,644,489],{"class":485},[479,646,493],{"class":492},[479,648,497],{"class":496},[479,650,501],{"class":500},[479,652,653,655,657,659,661,663,665,667],{"class":481,"line":504},[479,654,508],{"class":507},[479,656,511],{"class":500},[479,658,514],{"class":496},[479,660,517],{"class":500},[479,662,521],{"class":520},[479,664,517],{"class":500},[479,666,526],{"class":496},[479,668,529],{"class":500},[479,670,671,673,675],{"class":481,"line":532},[479,672,535],{"class":507},[479,674,511],{"class":500},[479,676,540],{"class":500},[479,678,679,682,684],{"class":481,"line":543},[479,680,681],{"class":507},"    local",[479,683,511],{"class":500},[479,685,540],{"class":500},[479,687,688,691,693,695,697,700,702,704],{"class":481,"line":554},[479,689,690],{"class":507},"      packages",[479,692,511],{"class":500},[479,694,514],{"class":496},[479,696,517],{"class":500},[479,698,699],{"class":520},"my-font-package",[479,701,517],{"class":500},[479,703,526],{"class":496},[479,705,529],{"class":500},[479,707,708,711,713,715,717,720,722,724],{"class":481,"line":589},[479,709,710],{"class":507},"      dirs",[479,712,511],{"class":500},[479,714,514],{"class":496},[479,716,517],{"class":500},[479,718,719],{"class":520},"assets\u002Ffonts",[479,721,517],{"class":500},[479,723,526],{"class":496},[479,725,529],{"class":500},[479,727,728],{"class":481,"line":597},[479,729,730],{"class":500},"    },\n",[479,732,733],{"class":481,"line":603},[479,734,600],{"class":500},[479,736,738,740],{"class":481,"line":737},9,[479,739,606],{"class":500},[479,741,609],{"class":496},[53,743,745],{"id":744},"google",[57,746,744],{},[49,748,749,755],{},[461,750,754],{"href":751,"rel":752},"https:\u002F\u002Ffonts.google.com\u002F",[753],"nofollow","Google Fonts"," is one of the best known public font APIs.",[53,757,759],{"id":758},"googleicons",[57,760,758],{},[49,762,763,768],{},[461,764,767],{"href":765,"rel":766},"https:\u002F\u002Ffonts.google.com\u002Ficons",[753],"Google Fonts Icons"," adds support for Material Symbols and Material Icons.",[53,770,772],{"id":771},"bunny",[57,773,771],{},[49,775,776,781,782,787],{},[461,777,780],{"href":778,"rel":779},"https:\u002F\u002Ffonts.bunny.net\u002F",[753],"Bunny Fonts"," is provided by ",[461,783,786],{"href":784,"rel":785},"https:\u002F\u002Fbunny.net\u002F",[753],"bunny.net"," and is a drop-in Google Fonts compatible API, focusing on privacy.",[53,789,791],{"id":790},"fontshare",[57,792,790],{},[49,794,795,800],{},[461,796,799],{"href":797,"rel":798},"https:\u002F\u002Fwww.fontshare.com\u002F",[753],"Fontshare"," is a free font service with 100+ professional-grade fonts from the Indian Type Foundry (ITF).",[445,802,804,805,156],{"to":803},"https:\u002F\u002Fwww.fontshare.com\u002Flicenses\u002Fitf-ffl","You should read their terms in full before using a font through ",[57,806,790],{},[53,808,810],{"id":809},"fontsource",[57,811,809],{},[49,813,814,819],{},[461,815,818],{"href":816,"rel":817},"https:\u002F\u002Ffontsource.org\u002Fdocs\u002Fgetting-started\u002Fintroduction",[753],"Fontsource"," is a collection of open-source fonts that are designed for self-hosting in web applications.",[53,821,822],{"id":466},[57,823,466],{},[49,825,826,827,830,831,69,838,434,844,851,852,855],{},"The npm provider resolves fonts from npm packages installed in your project's ",[57,828,829],{},"node_modules",". It automatically detects known font packages (such as ",[461,832,835],{"href":833,"rel":834},"https:\u002F\u002Ffontsource.org\u002F",[753],[57,836,837],{},"@fontsource\u002F*",[461,839,841],{"href":833,"rel":840},[753],[57,842,843],{},"@fontsource-variable\u002F*",[461,845,848],{"href":846,"rel":847},"https:\u002F\u002Fgithub.com\u002Fcalcom\u002Ffont",[753],[57,849,850],{},"cal-sans",") from your ",[57,853,854],{},"package.json"," dependencies and devDependencies.",[49,857,858,859,862],{},"By default the stylesheet shipped with the package is read from disk (",[57,860,861],{},"remote: false",") rather than from a CDN, and the font files it references are read from the installed package and served from your own origin.",[49,864,865,866,79,868,870,871,876],{},"Only packages that ship a CSS entrypoint (such as ",[57,867,837],{},[57,869,850],{},") can be used with this provider. Packages that ship bare font files are handled by the ",[461,872,874,467],{"href":873},"#local",[57,875,55],{}," instead.",[878,879,881,882,885,886,888,889,892],"note",{"to":880},"\u002Fget-started\u002Fconfiguration#provider","Setting a top-level ",[57,883,884],{},"provider"," disables every other provider, including ",[57,887,466],{},", so a per-family ",[57,890,891],{},"provider: 'npm'"," will not be used.",[470,894,896],{"className":472,"code":895,"language":474,"meta":475,"style":475},"export default defineNuxtConfig({\n  modules: ['@nuxt\u002Ffonts'],\n  fonts: {\n    families: [\n      \u002F\u002F Automatically resolved if @fontsource\u002Froboto is in your package.json\n      { name: 'Roboto', provider: 'npm' },\n      \u002F\u002F Variable fonts are also supported\n      { name: 'Inter Variable', provider: 'npm' },\n    ],\n  }\n})\n",[57,897,898,910,928,936,944,950,979,984,1013,1019,1024],{"__ignoreMap":475},[479,899,900,902,904,906,908],{"class":481,"line":482},[479,901,486],{"class":485},[479,903,489],{"class":485},[479,905,493],{"class":492},[479,907,497],{"class":496},[479,909,501],{"class":500},[479,911,912,914,916,918,920,922,924,926],{"class":481,"line":504},[479,913,508],{"class":507},[479,915,511],{"class":500},[479,917,514],{"class":496},[479,919,517],{"class":500},[479,921,521],{"class":520},[479,923,517],{"class":500},[479,925,526],{"class":496},[479,927,529],{"class":500},[479,929,930,932,934],{"class":481,"line":532},[479,931,535],{"class":507},[479,933,511],{"class":500},[479,935,540],{"class":500},[479,937,938,940,942],{"class":481,"line":543},[479,939,546],{"class":507},[479,941,511],{"class":500},[479,943,551],{"class":496},[479,945,946],{"class":481,"line":554},[479,947,949],{"class":948},"sHwdD","      \u002F\u002F Automatically resolved if @fontsource\u002Froboto is in your package.json\n",[479,951,952,954,956,958,960,963,965,967,969,971,973,975,977],{"class":481,"line":589},[479,953,557],{"class":500},[479,955,560],{"class":507},[479,957,511],{"class":500},[479,959,565],{"class":500},[479,961,962],{"class":520},"Roboto",[479,964,517],{"class":500},[479,966,573],{"class":500},[479,968,467],{"class":507},[479,970,511],{"class":500},[479,972,565],{"class":500},[479,974,466],{"class":520},[479,976,517],{"class":500},[479,978,586],{"class":500},[479,980,981],{"class":481,"line":597},[479,982,983],{"class":948},"      \u002F\u002F Variable fonts are also supported\n",[479,985,986,988,990,992,994,997,999,1001,1003,1005,1007,1009,1011],{"class":481,"line":603},[479,987,557],{"class":500},[479,989,560],{"class":507},[479,991,511],{"class":500},[479,993,565],{"class":500},[479,995,996],{"class":520},"Inter Variable",[479,998,517],{"class":500},[479,1000,573],{"class":500},[479,1002,467],{"class":507},[479,1004,511],{"class":500},[479,1006,565],{"class":500},[479,1008,466],{"class":520},[479,1010,517],{"class":500},[479,1012,586],{"class":500},[479,1014,1015,1017],{"class":481,"line":737},[479,1016,592],{"class":496},[479,1018,529],{"class":500},[479,1020,1022],{"class":481,"line":1021},10,[479,1023,600],{"class":500},[479,1025,1027,1029],{"class":481,"line":1026},11,[479,1028,606],{"class":500},[479,1030,609],{"class":496},[53,1032,1034],{"id":1033},"adobe",[57,1035,1033],{},[49,1037,1038,1043],{},[461,1039,1042],{"href":1040,"rel":1041},"https:\u002F\u002Ffonts.adobe.com\u002F",[753],"Adobe Fonts"," is a font service for both personal and commercial use included with Creative Cloud subscriptions.",[49,1045,1046],{},"To configure the Adobe provider in your Nuxt app, you must provide a Project ID or array of Project IDs corresponding to the Web Projects you have created in Adobe Fonts.",[470,1048,1050],{"className":472,"code":1049,"language":474,"meta":475,"style":475},"export default defineNuxtConfig({\n  modules: ['@nuxt\u002Ffonts'],\n  fonts: {\n    adobe: {\n      id: ['\u003Csome-id>', '\u003Canother-kit-id>'],\n    },\n  }\n})\n",[57,1051,1052,1064,1082,1090,1099,1128,1132,1136],{"__ignoreMap":475},[479,1053,1054,1056,1058,1060,1062],{"class":481,"line":482},[479,1055,486],{"class":485},[479,1057,489],{"class":485},[479,1059,493],{"class":492},[479,1061,497],{"class":496},[479,1063,501],{"class":500},[479,1065,1066,1068,1070,1072,1074,1076,1078,1080],{"class":481,"line":504},[479,1067,508],{"class":507},[479,1069,511],{"class":500},[479,1071,514],{"class":496},[479,1073,517],{"class":500},[479,1075,521],{"class":520},[479,1077,517],{"class":500},[479,1079,526],{"class":496},[479,1081,529],{"class":500},[479,1083,1084,1086,1088],{"class":481,"line":532},[479,1085,535],{"class":507},[479,1087,511],{"class":500},[479,1089,540],{"class":500},[479,1091,1092,1095,1097],{"class":481,"line":543},[479,1093,1094],{"class":507},"    adobe",[479,1096,511],{"class":500},[479,1098,540],{"class":500},[479,1100,1101,1104,1106,1108,1110,1113,1115,1117,1119,1122,1124,1126],{"class":481,"line":554},[479,1102,1103],{"class":507},"      id",[479,1105,511],{"class":500},[479,1107,514],{"class":496},[479,1109,517],{"class":500},[479,1111,1112],{"class":520},"\u003Csome-id>",[479,1114,517],{"class":500},[479,1116,573],{"class":500},[479,1118,565],{"class":500},[479,1120,1121],{"class":520},"\u003Canother-kit-id>",[479,1123,517],{"class":500},[479,1125,526],{"class":496},[479,1127,529],{"class":500},[479,1129,1130],{"class":481,"line":589},[479,1131,730],{"class":500},[479,1133,1134],{"class":481,"line":597},[479,1135,600],{"class":500},[479,1137,1138,1140],{"class":481,"line":603},[479,1139,606],{"class":500},[479,1141,609],{"class":496},[445,1143,1144],{},"We currently can't provide non-latin subsets for Adobe Fonts as they do not have a public API for that. Please use other providers in such cases.",[445,1146,804,1148,156],{"to":1147},"https:\u002F\u002Fwww.adobe.com\u002Flegal\u002Fterms.html",[57,1149,1033],{},[44,1151,1153],{"id":1152},"custom-providers","Custom Providers",[49,1155,1156,1157,156],{},"The core of the provider API in Nuxt Fonts has been extracted to a common library that can be used by any framework - ",[461,1158,1161],{"href":1159,"rel":1160},"https:\u002F\u002Fgithub.com\u002Funjs\u002Funifont",[753],[57,1162,1163],{},"unifont",[49,1165,1166,1167,1169],{},"The provider API is likely to evolve in the next few releases of ",[57,1168,1163],{},", but at the moment it looks like this:",[470,1171,1173],{"className":472,"code":1172,"language":474,"meta":475,"style":475},"import { defineFontProvider } from 'unifont'\n\nexport default defineFontProvider('some-custom-provider', async (options) => {\n  \u002F\u002F do some setup\n  return {\n    async resolveFont (fontFamily, options) {\n      if (fontFamily === 'My Font Family') {\n        return {\n          fonts: [\n            {\n              src: [\n                { url: 'https:\u002F\u002Fcdn.org\u002Fmy-font.woff2', format: 'woff2' },\n              ],\n              weight: 400,\n              style: 'normal',\n            }\n          ]\n        }\n      }\n    }\n  }\n})\n",[57,1174,1175,1199,1205,1243,1248,1255,1277,1301,1308,1317,1322,1331,1364,1372,1386,1402,1408,1414,1420,1426,1432,1437],{"__ignoreMap":475},[479,1176,1177,1180,1183,1186,1189,1192,1194,1196],{"class":481,"line":482},[479,1178,1179],{"class":485},"import",[479,1181,1182],{"class":500}," {",[479,1184,1185],{"class":496}," defineFontProvider",[479,1187,1188],{"class":500}," }",[479,1190,1191],{"class":485}," from",[479,1193,565],{"class":500},[479,1195,1163],{"class":520},[479,1197,1198],{"class":500},"'\n",[479,1200,1201],{"class":481,"line":504},[479,1202,1204],{"emptyLinePlaceholder":1203},true,"\n",[479,1206,1207,1209,1211,1213,1215,1217,1220,1222,1224,1228,1231,1235,1238,1241],{"class":481,"line":532},[479,1208,486],{"class":485},[479,1210,489],{"class":485},[479,1212,1185],{"class":492},[479,1214,497],{"class":496},[479,1216,517],{"class":500},[479,1218,1219],{"class":520},"some-custom-provider",[479,1221,517],{"class":500},[479,1223,573],{"class":500},[479,1225,1227],{"class":1226},"spNyl"," async",[479,1229,1230],{"class":500}," (",[479,1232,1234],{"class":1233},"sHdIc","options",[479,1236,1237],{"class":500},")",[479,1239,1240],{"class":1226}," =>",[479,1242,540],{"class":500},[479,1244,1245],{"class":481,"line":543},[479,1246,1247],{"class":948},"  \u002F\u002F do some setup\n",[479,1249,1250,1253],{"class":481,"line":554},[479,1251,1252],{"class":485},"  return",[479,1254,540],{"class":500},[479,1256,1257,1260,1263,1265,1268,1270,1273,1275],{"class":481,"line":589},[479,1258,1259],{"class":1226},"    async",[479,1261,1262],{"class":507}," resolveFont ",[479,1264,497],{"class":500},[479,1266,1267],{"class":1233},"fontFamily",[479,1269,573],{"class":500},[479,1271,1272],{"class":1233}," options",[479,1274,1237],{"class":500},[479,1276,540],{"class":500},[479,1278,1279,1282,1284,1286,1289,1291,1294,1296,1299],{"class":481,"line":597},[479,1280,1281],{"class":485},"      if",[479,1283,1230],{"class":507},[479,1285,1267],{"class":496},[479,1287,1288],{"class":500}," ===",[479,1290,565],{"class":500},[479,1292,1293],{"class":520},"My Font Family",[479,1295,517],{"class":500},[479,1297,1298],{"class":507},") ",[479,1300,501],{"class":500},[479,1302,1303,1306],{"class":481,"line":603},[479,1304,1305],{"class":485},"        return",[479,1307,540],{"class":500},[479,1309,1310,1313,1315],{"class":481,"line":737},[479,1311,1312],{"class":507},"          fonts",[479,1314,511],{"class":500},[479,1316,551],{"class":507},[479,1318,1319],{"class":481,"line":1021},[479,1320,1321],{"class":500},"            {\n",[479,1323,1324,1327,1329],{"class":481,"line":1026},[479,1325,1326],{"class":507},"              src",[479,1328,511],{"class":500},[479,1330,551],{"class":507},[479,1332,1334,1337,1340,1342,1344,1347,1349,1351,1354,1356,1358,1360,1362],{"class":481,"line":1333},12,[479,1335,1336],{"class":500},"                {",[479,1338,1339],{"class":507}," url",[479,1341,511],{"class":500},[479,1343,565],{"class":500},[479,1345,1346],{"class":520},"https:\u002F\u002Fcdn.org\u002Fmy-font.woff2",[479,1348,517],{"class":500},[479,1350,573],{"class":500},[479,1352,1353],{"class":507}," format",[479,1355,511],{"class":500},[479,1357,565],{"class":500},[479,1359,75],{"class":520},[479,1361,517],{"class":500},[479,1363,586],{"class":500},[479,1365,1367,1370],{"class":481,"line":1366},13,[479,1368,1369],{"class":507},"              ]",[479,1371,529],{"class":500},[479,1373,1375,1378,1380,1384],{"class":481,"line":1374},14,[479,1376,1377],{"class":507},"              weight",[479,1379,511],{"class":500},[479,1381,1383],{"class":1382},"sbssI"," 400",[479,1385,529],{"class":500},[479,1387,1389,1392,1394,1396,1398,1400],{"class":481,"line":1388},15,[479,1390,1391],{"class":507},"              style",[479,1393,511],{"class":500},[479,1395,565],{"class":500},[479,1397,97],{"class":520},[479,1399,517],{"class":500},[479,1401,529],{"class":500},[479,1403,1405],{"class":481,"line":1404},16,[479,1406,1407],{"class":500},"            }\n",[479,1409,1411],{"class":481,"line":1410},17,[479,1412,1413],{"class":507},"          ]\n",[479,1415,1417],{"class":481,"line":1416},18,[479,1418,1419],{"class":500},"        }\n",[479,1421,1423],{"class":481,"line":1422},19,[479,1424,1425],{"class":500},"      }\n",[479,1427,1429],{"class":481,"line":1428},20,[479,1430,1431],{"class":500},"    }\n",[479,1433,1435],{"class":481,"line":1434},21,[479,1436,600],{"class":500},[479,1438,1440,1442],{"class":481,"line":1439},22,[479,1441,606],{"class":500},[479,1443,609],{"class":496},[49,1445,1446,1447,1450],{},"Module authors can also add their own providers (or remove existing ones) in the ",[57,1448,1449],{},"fonts:providers"," hook which is called by Nuxt Fonts after all modules have run.",[470,1452,1454],{"className":472,"code":1453,"language":474,"meta":475,"style":475},"nuxt.hook('fonts:providers', providers => {\n  delete providers.adobe\n\n  providers['custom-provider'] = defineFontProvider('custom-provider', async () => {\n    \u002F** some setup *\u002F\n    return {\n      async resolveFont (fontFamily, options) {\n        \u002F** resolve font faces *\u002F\n      }\n    }\n  })\n})\n",[57,1455,1456,1483,1495,1499,1541,1546,1553,1572,1577,1581,1585,1592],{"__ignoreMap":475},[479,1457,1458,1461,1463,1466,1468,1470,1472,1474,1476,1479,1481],{"class":481,"line":482},[479,1459,1460],{"class":496},"nuxt",[479,1462,156],{"class":500},[479,1464,1465],{"class":492},"hook",[479,1467,497],{"class":496},[479,1469,517],{"class":500},[479,1471,1449],{"class":520},[479,1473,517],{"class":500},[479,1475,573],{"class":500},[479,1477,1478],{"class":1233}," providers",[479,1480,1240],{"class":1226},[479,1482,540],{"class":500},[479,1484,1485,1488,1490,1492],{"class":481,"line":504},[479,1486,1487],{"class":500},"  delete",[479,1489,1478],{"class":496},[479,1491,156],{"class":500},[479,1493,1494],{"class":496},"adobe\n",[479,1496,1497],{"class":481,"line":532},[479,1498,1204],{"emptyLinePlaceholder":1203},[479,1500,1501,1504,1507,1509,1512,1514,1517,1520,1522,1524,1526,1528,1530,1532,1534,1537,1539],{"class":481,"line":543},[479,1502,1503],{"class":496},"  providers",[479,1505,1506],{"class":507},"[",[479,1508,517],{"class":500},[479,1510,1511],{"class":520},"custom-provider",[479,1513,517],{"class":500},[479,1515,1516],{"class":507},"] ",[479,1518,1519],{"class":500},"=",[479,1521,1185],{"class":492},[479,1523,497],{"class":507},[479,1525,517],{"class":500},[479,1527,1511],{"class":520},[479,1529,517],{"class":500},[479,1531,573],{"class":500},[479,1533,1227],{"class":1226},[479,1535,1536],{"class":500}," ()",[479,1538,1240],{"class":1226},[479,1540,540],{"class":500},[479,1542,1543],{"class":481,"line":554},[479,1544,1545],{"class":948},"    \u002F** some setup *\u002F\n",[479,1547,1548,1551],{"class":481,"line":589},[479,1549,1550],{"class":485},"    return",[479,1552,540],{"class":500},[479,1554,1555,1558,1560,1562,1564,1566,1568,1570],{"class":481,"line":597},[479,1556,1557],{"class":1226},"      async",[479,1559,1262],{"class":507},[479,1561,497],{"class":500},[479,1563,1267],{"class":1233},[479,1565,573],{"class":500},[479,1567,1272],{"class":1233},[479,1569,1237],{"class":500},[479,1571,540],{"class":500},[479,1573,1574],{"class":481,"line":603},[479,1575,1576],{"class":948},"        \u002F** resolve font faces *\u002F\n",[479,1578,1579],{"class":481,"line":737},[479,1580,1425],{"class":500},[479,1582,1583],{"class":481,"line":1021},[479,1584,1431],{"class":500},[479,1586,1587,1590],{"class":481,"line":1026},[479,1588,1589],{"class":500},"  }",[479,1591,609],{"class":507},[479,1593,1594,1596],{"class":481,"line":1333},[479,1595,606],{"class":500},[479,1597,609],{"class":496},[1599,1600,1601],"style",{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}",{"title":475,"searchDepth":504,"depth":504,"links":1603},[1604,1614],{"id":46,"depth":504,"text":47,"children":1605},[1606,1607,1608,1609,1610,1611,1612,1613],{"id":55,"depth":532,"text":55},{"id":744,"depth":532,"text":744},{"id":758,"depth":532,"text":758},{"id":771,"depth":532,"text":771},{"id":790,"depth":532,"text":790},{"id":809,"depth":532,"text":809},{"id":466,"depth":532,"text":466},{"id":1033,"depth":532,"text":1033},{"id":1152,"depth":504,"text":1153},"Font providers are designed to be pluggable and extensible, so no matter your setup you should be able to use an existing provider or write your own.","md",null,{},{"title":22,"description":1615},"MgNCavvp73yitAdBXLHRRuJYgvvfa9p9oGWdVbmprZI",[1622,1624],{"title":18,"path":19,"stem":20,"description":1623,"children":-1},"Use Nuxt Fonts with any CSS framework or library.",{"title":26,"path":27,"stem":28,"description":1625,"children":-1},"Breaking changes and migration steps when upgrading to the latest version of @nuxt\u002Ffonts.",1791484620140]