[{"data":1,"prerenderedAt":1172},["ShallowReactive",2],{"navigation_docs":3,"-providers-storyblok":220,"-providers-storyblok-surround":1167},[4,30,47,207],{"title":5,"path":6,"stem":7,"children":8,"page":29},"Get 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},"Providers","\u002Fget-started\u002Fproviders","1.get-started\u002F3.providers",{"title":22,"path":23,"stem":24},"Contributing","\u002Fget-started\u002Fcontributing","1.get-started\u002F4.contributing",{"title":26,"path":27,"stem":28},"Migration","\u002Fget-started\u002Fmigration","1.get-started\u002F5.migration",false,{"title":31,"path":32,"stem":33,"children":34,"page":29},"Usage","\u002Fusage","2.usage",[35,39,43],{"title":36,"path":37,"stem":38},"\u003CNuxtImg>","\u002Fusage\u002Fnuxt-img","2.usage\u002F1.nuxt-img",{"title":40,"path":41,"stem":42},"\u003CNuxtPicture>","\u002Fusage\u002Fnuxt-picture","2.usage\u002F2.nuxt-picture",{"title":44,"path":45,"stem":46},"useImage()","\u002Fusage\u002Fuse-image","2.usage\u002F3.use-image",{"title":18,"path":48,"stem":49,"children":50,"page":29},"\u002Fproviders","3.providers",[51,55,59,63,67,71,75,79,83,87,91,95,99,103,107,111,115,119,123,127,131,135,139,143,147,151,155,159,163,167,171,175,179,183,187,191,195,199,203],{"title":52,"path":53,"stem":54},"Aliyun","\u002Fproviders\u002Faliyun","3.providers\u002Faliyun",{"title":56,"path":57,"stem":58},"AWS Amplify","\u002Fproviders\u002Faws-amplify","3.providers\u002Faws-amplify",{"title":60,"path":61,"stem":62},"Builder.io","\u002Fproviders\u002Fbuilderio","3.providers\u002Fbuilderio",{"title":64,"path":65,"stem":66},"Bunny","\u002Fproviders\u002Fbunny","3.providers\u002Fbunny",{"title":68,"path":69,"stem":70},"Caisy","\u002Fproviders\u002Fcaisy","3.providers\u002Fcaisy",{"title":72,"path":73,"stem":74},"Cloudflare","\u002Fproviders\u002Fcloudflare","3.providers\u002Fcloudflare",{"title":76,"path":77,"stem":78},"Cloudflare Images","\u002Fproviders\u002Fcloudflareimages","3.providers\u002Fcloudflareimages",{"title":80,"path":81,"stem":82},"Cloudimage","\u002Fproviders\u002Fcloudimage","3.providers\u002Fcloudimage",{"title":84,"path":85,"stem":86},"Cloudinary","\u002Fproviders\u002Fcloudinary","3.providers\u002Fcloudinary",{"title":88,"path":89,"stem":90},"Contentful","\u002Fproviders\u002Fcontentful","3.providers\u002Fcontentful",{"title":92,"path":93,"stem":94},"Directus","\u002Fproviders\u002Fdirectus","3.providers\u002Fdirectus",{"title":96,"path":97,"stem":98},"Fastly","\u002Fproviders\u002Ffastly","3.providers\u002Ffastly",{"title":100,"path":101,"stem":102},"Filerobot","\u002Fproviders\u002Ffilerobot","3.providers\u002Ffilerobot",{"title":104,"path":105,"stem":106},"Flyimg","\u002Fproviders\u002Fflyimg","3.providers\u002Fflyimg",{"title":108,"path":109,"stem":110},"GitHub","\u002Fproviders\u002Fgithub","3.providers\u002Fgithub",{"title":112,"path":113,"stem":114},"Glide","\u002Fproviders\u002Fglide","3.providers\u002Fglide",{"title":116,"path":117,"stem":118},"Gumlet","\u002Fproviders\u002Fgumlet","3.providers\u002Fgumlet",{"title":120,"path":121,"stem":122},"Hygraph","\u002Fproviders\u002Fhygraph","3.providers\u002Fhygraph",{"title":124,"path":125,"stem":126},"ImageEngine","\u002Fproviders\u002Fimageengine","3.providers\u002Fimageengine",{"title":128,"path":129,"stem":130},"ImageKit","\u002Fproviders\u002Fimagekit","3.providers\u002Fimagekit",{"title":132,"path":133,"stem":134},"Imgix","\u002Fproviders\u002Fimgix","3.providers\u002Fimgix",{"title":136,"path":137,"stem":138},"IPX","\u002Fproviders\u002Fipx","3.providers\u002Fipx",{"title":140,"path":141,"stem":142},"Netlify","\u002Fproviders\u002Fnetlify","3.providers\u002Fnetlify",{"title":144,"path":145,"stem":146},"None","\u002Fproviders\u002Fnone","3.providers\u002Fnone",{"title":148,"path":149,"stem":150},"Picsum","\u002Fproviders\u002Fpicsum","3.providers\u002Fpicsum",{"title":152,"path":153,"stem":154},"Prepr","\u002Fproviders\u002Fprepr","3.providers\u002Fprepr",{"title":156,"path":157,"stem":158},"Prismic","\u002Fproviders\u002Fprismic","3.providers\u002Fprismic",{"title":160,"path":161,"stem":162},"Sanity","\u002Fproviders\u002Fsanity","3.providers\u002Fsanity",{"title":164,"path":165,"stem":166},"Shopify","\u002Fproviders\u002Fshopify","3.providers\u002Fshopify",{"title":168,"path":169,"stem":170},"Sirv","\u002Fproviders\u002Fsirv","3.providers\u002Fsirv",{"title":172,"path":173,"stem":174},"Storyblok","\u002Fproviders\u002Fstoryblok","3.providers\u002Fstoryblok",{"title":176,"path":177,"stem":178},"Strapi","\u002Fproviders\u002Fstrapi","3.providers\u002Fstrapi",{"title":180,"path":181,"stem":182},"Supabase","\u002Fproviders\u002Fsupabase","3.providers\u002Fsupabase",{"title":184,"path":185,"stem":186},"Twicpics","\u002Fproviders\u002Ftwicpics","3.providers\u002Ftwicpics",{"title":188,"path":189,"stem":190},"Umbraco","\u002Fproviders\u002Fumbraco","3.providers\u002Fumbraco",{"title":192,"path":193,"stem":194},"Unsplash","\u002Fproviders\u002Funsplash","3.providers\u002Funsplash",{"title":196,"path":197,"stem":198},"Uploadcare","\u002Fproviders\u002Fuploadcare","3.providers\u002Fuploadcare",{"title":200,"path":201,"stem":202},"Vercel","\u002Fproviders\u002Fvercel","3.providers\u002Fvercel",{"title":204,"path":205,"stem":206},"Weserv","\u002Fproviders\u002Fweserv","3.providers\u002Fweserv",{"title":208,"path":209,"stem":210,"children":211,"page":29},"Advanced","\u002Fadvanced","4.advanced",[212,216],{"title":213,"path":214,"stem":215},"Custom Provider","\u002Fadvanced\u002Fcustom-provider","4.advanced\u002F1.custom-provider",{"title":217,"path":218,"stem":219},"Static Images","\u002Fadvanced\u002Fstatic-images","4.advanced\u002F2.static-images",{"id":221,"title":172,"body":222,"description":1156,"extension":1157,"links":1158,"meta":1164,"navigation":438,"path":173,"seo":1165,"stem":174,"__hash__":1166},"docs\u002F3.providers\u002Fstoryblok.md",{"type":223,"value":224,"toc":1146},"minimark",[225,236,333,338,346,351,360,363,373,376,552,556,562,573,576,578,701,705,711,725,727,791,795,801,804,806,871,875,881,884,886,977,981,987,994,996,1142],[226,227,228,229,235],"p",{},"Integration between ",[230,231,172],"a",{"href":232,"rel":233},"https:\u002F\u002Fwww.storyblok.com\u002Fdocs\u002Fapi\u002Fimage-service",[234],"nofollow"," and the image module. To use this provider you just need to specify the base URL of your service in Storyblok.",[237,238,244],"pre",{"className":239,"code":240,"filename":241,"language":242,"meta":243,"style":243},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n  image: {\n    storyblok: {\n      baseURL: 'https:\u002F\u002Fa.storyblok.com'\n    }\n  }\n})\n","nuxt.config.ts","ts","",[245,246,247,271,284,294,312,318,324],"code",{"__ignoreMap":243},[248,249,252,256,259,263,267],"span",{"class":250,"line":251},"line",1,[248,253,255],{"class":254},"s7zQu","export",[248,257,258],{"class":254}," default",[248,260,262],{"class":261},"s2Zo4"," defineNuxtConfig",[248,264,266],{"class":265},"sTEyZ","(",[248,268,270],{"class":269},"sMK4o","{\n",[248,272,274,278,281],{"class":250,"line":273},2,[248,275,277],{"class":276},"swJcz","  image",[248,279,280],{"class":269},":",[248,282,283],{"class":269}," {\n",[248,285,287,290,292],{"class":250,"line":286},3,[248,288,289],{"class":276},"    storyblok",[248,291,280],{"class":269},[248,293,283],{"class":269},[248,295,297,300,302,305,309],{"class":250,"line":296},4,[248,298,299],{"class":276},"      baseURL",[248,301,280],{"class":269},[248,303,304],{"class":269}," '",[248,306,308],{"class":307},"sfazB","https:\u002F\u002Fa.storyblok.com",[248,310,311],{"class":269},"'\n",[248,313,315],{"class":250,"line":314},5,[248,316,317],{"class":269},"    }\n",[248,319,321],{"class":250,"line":320},6,[248,322,323],{"class":269},"  }\n",[248,325,327,330],{"class":250,"line":326},7,[248,328,329],{"class":269},"}",[248,331,332],{"class":265},")\n",[334,335,337],"h2",{"id":336},"storyblok-modifiers","Storyblok Modifiers",[226,339,340,341,345],{},"Check out available ",[230,342,344],{"href":232,"rel":343},[234],"Storyblok image service"," modifiers.",[347,348,350],"h3",{"id":349},"resizing","Resizing",[226,352,353,354,359],{},"Check ",[230,355,358],{"href":356,"rel":357},"https:\u002F\u002Fwww.storyblok.com\u002Fdocs\u002Fapi\u002Fimage-service\u002Foperations\u002Fresize",[234],"Storyblok documentation"," if you want to know more.",[226,361,362],{},"the logic is:",[364,365,366,370],"ul",{},[367,368,369],"li",{},"If you do not define either width or height, the image will not be resized.",[367,371,372],{},"If you define only width or only height the image will be proportionately resized based on the one you defined.",[226,374,375],{},"Example:",[237,377,381],{"className":378,"code":379,"language":380,"meta":243,"style":243},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003C!-- Original -->\n\u003CNuxtImg\n  provider=\"storyblok\"\n  src=\"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F3310x2192\u002Fe4ec08624e\u002Fdemo-image.jpeg\"\n\u002F>\n\n\u003C!-- Resized static -->\n\u003CNuxtImg\n  provider=\"storyblok\"\n  src=\"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F3310x2192\u002Fe4ec08624e\u002Fdemo-image.jpeg\"\n  width=\"500\"\n  height=\"500\"\n\u002F>\n\n\u003C!-- Proportional to width -->\n\u003CNuxtImg\n  provider=\"storyblok\"\n  src=\"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F3310x2192\u002Fe4ec08624e\u002Fdemo-image.jpeg\"\n  width=\"500\"\n\u002F>\n\n\u003C!-- Proportional to height -->\n\u003CNuxtImg\n  provider=\"storyblok\"\n  src=\"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F3310x2192\u002Fe4ec08624e\u002Fdemo-image.jpeg\"\n  height=\"500\"\n\u002F>\n","vue",[245,382,383,389,397,415,429,434,440,445,451,457,463,469,475,480,485,491,496,501,506,511,516,521,527,532,537,542,547],{"__ignoreMap":243},[248,384,385],{"class":250,"line":251},[248,386,388],{"class":387},"sHwdD","\u003C!-- Original -->\n",[248,390,391,394],{"class":250,"line":273},[248,392,393],{"class":269},"\u003C",[248,395,396],{"class":276},"NuxtImg\n",[248,398,399,403,406,409,412],{"class":250,"line":286},[248,400,402],{"class":401},"spNyl","  provider",[248,404,405],{"class":269},"=",[248,407,408],{"class":269},"\"",[248,410,411],{"class":307},"storyblok",[248,413,414],{"class":269},"\"\n",[248,416,417,420,422,424,427],{"class":250,"line":296},[248,418,419],{"class":401},"  src",[248,421,405],{"class":269},[248,423,408],{"class":269},[248,425,426],{"class":307},"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F3310x2192\u002Fe4ec08624e\u002Fdemo-image.jpeg",[248,428,414],{"class":269},[248,430,431],{"class":250,"line":314},[248,432,433],{"class":265},"\u002F>\n",[248,435,436],{"class":250,"line":320},[248,437,439],{"emptyLinePlaceholder":438},true,"\n",[248,441,442],{"class":250,"line":326},[248,443,444],{"class":265},"\u003C!-- Resized static -->\n",[248,446,448],{"class":250,"line":447},8,[248,449,450],{"class":265},"\u003CNuxtImg\n",[248,452,454],{"class":250,"line":453},9,[248,455,456],{"class":265},"  provider=\"storyblok\"\n",[248,458,460],{"class":250,"line":459},10,[248,461,462],{"class":265},"  src=\"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F3310x2192\u002Fe4ec08624e\u002Fdemo-image.jpeg\"\n",[248,464,466],{"class":250,"line":465},11,[248,467,468],{"class":265},"  width=\"500\"\n",[248,470,472],{"class":250,"line":471},12,[248,473,474],{"class":265},"  height=\"500\"\n",[248,476,478],{"class":250,"line":477},13,[248,479,433],{"class":265},[248,481,483],{"class":250,"line":482},14,[248,484,439],{"emptyLinePlaceholder":438},[248,486,488],{"class":250,"line":487},15,[248,489,490],{"class":265},"\u003C!-- Proportional to width -->\n",[248,492,494],{"class":250,"line":493},16,[248,495,450],{"class":265},[248,497,499],{"class":250,"line":498},17,[248,500,456],{"class":265},[248,502,504],{"class":250,"line":503},18,[248,505,462],{"class":265},[248,507,509],{"class":250,"line":508},19,[248,510,468],{"class":265},[248,512,514],{"class":250,"line":513},20,[248,515,433],{"class":265},[248,517,519],{"class":250,"line":518},21,[248,520,439],{"emptyLinePlaceholder":438},[248,522,524],{"class":250,"line":523},22,[248,525,526],{"class":265},"\u003C!-- Proportional to height -->\n",[248,528,530],{"class":250,"line":529},23,[248,531,450],{"class":265},[248,533,535],{"class":250,"line":534},24,[248,536,456],{"class":265},[248,538,540],{"class":250,"line":539},25,[248,541,462],{"class":265},[248,543,545],{"class":250,"line":544},26,[248,546,474],{"class":265},[248,548,550],{"class":250,"line":549},27,[248,551,433],{"class":265},[347,553,555],{"id":554},"fit-in-with-background-or-not","Fit in with background or not",[226,557,353,558,359],{},[230,559,358],{"href":560,"rel":561},"https:\u002F\u002Fwww.storyblok.com\u002Fdocs\u002Fapi\u002Fimage-service\u002Foperations\u002Ffit-in",[234],[226,563,564,565,568,569,572],{},"If you want to use it just add a props ",[245,566,567],{},"fit=\"in\"",". Take care that Storyblok only support ",[245,570,571],{},"fit-in",".",[226,574,575],{},"You can also use the fill filters to fill your fit-in with a specific background. If you not defining value it will be transparent.",[226,577,375],{},[237,579,581],{"className":378,"code":580,"language":380,"meta":243,"style":243},"\u003CNuxtImg\n  provider=\"storyblok\"\n  src=\"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F3310x2192\u002Fe4ec08624e\u002Fdemo-image.jpeg\"\n  width=\"200\"\n  height=\"200\"\n  fit=\"in\"\n  :modifiers=\"{ filters: { fill: 'CCCCCC' } }\"\n\u002F>\n",[245,582,583,589,601,613,627,640,654,697],{"__ignoreMap":243},[248,584,585,587],{"class":250,"line":251},[248,586,393],{"class":269},[248,588,396],{"class":276},[248,590,591,593,595,597,599],{"class":250,"line":273},[248,592,402],{"class":401},[248,594,405],{"class":269},[248,596,408],{"class":269},[248,598,411],{"class":307},[248,600,414],{"class":269},[248,602,603,605,607,609,611],{"class":250,"line":286},[248,604,419],{"class":401},[248,606,405],{"class":269},[248,608,408],{"class":269},[248,610,426],{"class":307},[248,612,414],{"class":269},[248,614,615,618,620,622,625],{"class":250,"line":296},[248,616,617],{"class":401},"  width",[248,619,405],{"class":269},[248,621,408],{"class":269},[248,623,624],{"class":307},"200",[248,626,414],{"class":269},[248,628,629,632,634,636,638],{"class":250,"line":314},[248,630,631],{"class":401},"  height",[248,633,405],{"class":269},[248,635,408],{"class":269},[248,637,624],{"class":307},[248,639,414],{"class":269},[248,641,642,645,647,649,652],{"class":250,"line":320},[248,643,644],{"class":401},"  fit",[248,646,405],{"class":269},[248,648,408],{"class":269},[248,650,651],{"class":307},"in",[248,653,414],{"class":269},[248,655,656,659,662,664,666,669,672,674,677,680,682,684,687,690,693,695],{"class":250,"line":326},[248,657,658],{"class":269},"  :",[248,660,661],{"class":401},"modifiers",[248,663,405],{"class":269},[248,665,408],{"class":269},[248,667,668],{"class":269},"{",[248,670,671],{"class":276}," filters",[248,673,280],{"class":269},[248,675,676],{"class":269}," {",[248,678,679],{"class":276}," fill",[248,681,280],{"class":269},[248,683,304],{"class":269},[248,685,686],{"class":307},"CCCCCC",[248,688,689],{"class":269},"'",[248,691,692],{"class":269}," }",[248,694,692],{"class":269},[248,696,414],{"class":269},[248,698,699],{"class":250,"line":447},[248,700,433],{"class":265},[347,702,704],{"id":703},"format","Format",[226,706,353,707,359],{},[230,708,358],{"href":709,"rel":710},"https:\u002F\u002Fwww.storyblok.com\u002Fdocs\u002Fapi\u002Fimage-service\u002Foperations\u002Fformat",[234],[226,712,713,714,717,718,721,722,572],{},"You can modify your image format. Supported format are ",[245,715,716],{},"webp",", ",[245,719,720],{},"jpeg"," and ",[245,723,724],{},"png",[226,726,375],{},[237,728,730],{"className":378,"code":729,"language":380,"meta":243,"style":243},"\u003CNuxtImg\n  provider=\"storyblok\"\n  src=\"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F3310x2192\u002Fe4ec08624e\u002Fdemo-image.jpeg\"\n  width=\"200\"\n  format=\"webp\"\n\u002F>\n",[245,731,732,738,750,762,774,787],{"__ignoreMap":243},[248,733,734,736],{"class":250,"line":251},[248,735,393],{"class":269},[248,737,396],{"class":276},[248,739,740,742,744,746,748],{"class":250,"line":273},[248,741,402],{"class":401},[248,743,405],{"class":269},[248,745,408],{"class":269},[248,747,411],{"class":307},[248,749,414],{"class":269},[248,751,752,754,756,758,760],{"class":250,"line":286},[248,753,419],{"class":401},[248,755,405],{"class":269},[248,757,408],{"class":269},[248,759,426],{"class":307},[248,761,414],{"class":269},[248,763,764,766,768,770,772],{"class":250,"line":296},[248,765,617],{"class":401},[248,767,405],{"class":269},[248,769,408],{"class":269},[248,771,624],{"class":307},[248,773,414],{"class":269},[248,775,776,779,781,783,785],{"class":250,"line":314},[248,777,778],{"class":401},"  format",[248,780,405],{"class":269},[248,782,408],{"class":269},[248,784,716],{"class":307},[248,786,414],{"class":269},[248,788,789],{"class":250,"line":320},[248,790,433],{"class":265},[347,792,794],{"id":793},"quality","Quality",[226,796,353,797,359],{},[230,798,358],{"href":799,"rel":800},"https:\u002F\u002Fwww.storyblok.com\u002Fdocs\u002Fapi\u002Fimage-service\u002Foperations\u002Fquality",[234],[226,802,803],{},"You can update your image quality by defining the quality filters.",[226,805,375],{},[237,807,809],{"className":378,"code":808,"language":380,"meta":243,"style":243},"\u003CNuxtImg\n  provider=\"storyblok\"\n  src=\"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F3310x2192\u002Fe4ec08624e\u002Fdemo-image.jpeg\"\n  width=\"200\"\n  quality=\"10\"\n\u002F>\n",[245,810,811,817,829,841,853,867],{"__ignoreMap":243},[248,812,813,815],{"class":250,"line":251},[248,814,393],{"class":269},[248,816,396],{"class":276},[248,818,819,821,823,825,827],{"class":250,"line":273},[248,820,402],{"class":401},[248,822,405],{"class":269},[248,824,408],{"class":269},[248,826,411],{"class":307},[248,828,414],{"class":269},[248,830,831,833,835,837,839],{"class":250,"line":286},[248,832,419],{"class":401},[248,834,405],{"class":269},[248,836,408],{"class":269},[248,838,426],{"class":307},[248,840,414],{"class":269},[248,842,843,845,847,849,851],{"class":250,"line":296},[248,844,617],{"class":401},[248,846,405],{"class":269},[248,848,408],{"class":269},[248,850,624],{"class":307},[248,852,414],{"class":269},[248,854,855,858,860,862,865],{"class":250,"line":314},[248,856,857],{"class":401},"  quality",[248,859,405],{"class":269},[248,861,408],{"class":269},[248,863,864],{"class":307},"10",[248,866,414],{"class":269},[248,868,869],{"class":250,"line":320},[248,870,433],{"class":265},[347,872,874],{"id":873},"facial-detection","Facial detection",[226,876,353,877,359],{},[230,878,358],{"href":879,"rel":880},"https:\u002F\u002Fwww.storyblok.com\u002Fdocs\u002Fapi\u002Fimage-service\u002Foperations\u002Fcrop#smart-crop",[234],[226,882,883],{},"To have a smart crop just define a smart property inside modifier.",[226,885,375],{},[237,887,889],{"className":378,"code":888,"language":380,"meta":243,"style":243},"\u003CNuxtImg\n  provider=\"storyblok\"\n  src=\"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F2250x1500\u002Fc15735a73c\u002Fdemo-image-human.jpeg\"\n  width=\"600\"\n  height=\"130\"\n  :modifiers=\"{ smart: true }\"\n\u002F>\n",[245,890,891,897,909,922,935,948,973],{"__ignoreMap":243},[248,892,893,895],{"class":250,"line":251},[248,894,393],{"class":269},[248,896,396],{"class":276},[248,898,899,901,903,905,907],{"class":250,"line":273},[248,900,402],{"class":401},[248,902,405],{"class":269},[248,904,408],{"class":269},[248,906,411],{"class":307},[248,908,414],{"class":269},[248,910,911,913,915,917,920],{"class":250,"line":286},[248,912,419],{"class":401},[248,914,405],{"class":269},[248,916,408],{"class":269},[248,918,919],{"class":307},"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F2250x1500\u002Fc15735a73c\u002Fdemo-image-human.jpeg",[248,921,414],{"class":269},[248,923,924,926,928,930,933],{"class":250,"line":296},[248,925,617],{"class":401},[248,927,405],{"class":269},[248,929,408],{"class":269},[248,931,932],{"class":307},"600",[248,934,414],{"class":269},[248,936,937,939,941,943,946],{"class":250,"line":314},[248,938,631],{"class":401},[248,940,405],{"class":269},[248,942,408],{"class":269},[248,944,945],{"class":307},"130",[248,947,414],{"class":269},[248,949,950,952,954,956,958,960,963,965,969,971],{"class":250,"line":320},[248,951,658],{"class":269},[248,953,661],{"class":401},[248,955,405],{"class":269},[248,957,408],{"class":269},[248,959,668],{"class":269},[248,961,962],{"class":276}," smart",[248,964,280],{"class":269},[248,966,968],{"class":967},"sfNiH"," true",[248,970,692],{"class":269},[248,972,414],{"class":269},[248,974,975],{"class":250,"line":326},[248,976,433],{"class":265},[347,978,980],{"id":979},"custom-focal-point","Custom focal point",[226,982,353,983,359],{},[230,984,358],{"href":985,"rel":986},"https:\u002F\u002Fwww.storyblok.com\u002Fdocs\u002Fapi\u002Fimage-service\u002Foperations\u002Ffocal-point",[234],[226,988,989,990,993],{},"Storyblok allows you to focalize on a specific part of your image. Just use ",[245,991,992],{},"focal"," filters.",[226,995,375],{},[237,997,999],{"className":378,"code":998,"language":380,"meta":243,"style":243},"\u003C!-- Focus on the top of the image -->\n\u003CNuxtImg\n  provider=\"storyblok\"\n  src=\"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F1000x600\u002Fd962430746\u002Fdemo-image-human.jpeg\"\n  width=\"600\"\n  height=\"130\"\n  :modifiers=\"{ filters: { focal: '450x0:550x100' } }\"\n\u002F>\n\n\u003C!-- Focus on the bottom of the image -->\n\u003CNuxtImg\n  provider=\"storyblok\"\n  src=\"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F1000x600\u002Fd962430746\u002Fdemo-image-human.jpeg\"\n  width=\"600\"\n  height=\"130\"\n  :modifiers=\"{ filters: { focal: '450x500:550x600' } }\"\n\u002F>\n",[245,1000,1001,1006,1012,1024,1037,1049,1061,1097,1101,1105,1110,1114,1118,1123,1128,1133,1138],{"__ignoreMap":243},[248,1002,1003],{"class":250,"line":251},[248,1004,1005],{"class":387},"\u003C!-- Focus on the top of the image -->\n",[248,1007,1008,1010],{"class":250,"line":273},[248,1009,393],{"class":269},[248,1011,396],{"class":276},[248,1013,1014,1016,1018,1020,1022],{"class":250,"line":286},[248,1015,402],{"class":401},[248,1017,405],{"class":269},[248,1019,408],{"class":269},[248,1021,411],{"class":307},[248,1023,414],{"class":269},[248,1025,1026,1028,1030,1032,1035],{"class":250,"line":296},[248,1027,419],{"class":401},[248,1029,405],{"class":269},[248,1031,408],{"class":269},[248,1033,1034],{"class":307},"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F1000x600\u002Fd962430746\u002Fdemo-image-human.jpeg",[248,1036,414],{"class":269},[248,1038,1039,1041,1043,1045,1047],{"class":250,"line":314},[248,1040,617],{"class":401},[248,1042,405],{"class":269},[248,1044,408],{"class":269},[248,1046,932],{"class":307},[248,1048,414],{"class":269},[248,1050,1051,1053,1055,1057,1059],{"class":250,"line":320},[248,1052,631],{"class":401},[248,1054,405],{"class":269},[248,1056,408],{"class":269},[248,1058,945],{"class":307},[248,1060,414],{"class":269},[248,1062,1063,1065,1067,1069,1071,1073,1075,1077,1079,1082,1084,1086,1089,1091,1093,1095],{"class":250,"line":326},[248,1064,658],{"class":269},[248,1066,661],{"class":401},[248,1068,405],{"class":269},[248,1070,408],{"class":269},[248,1072,668],{"class":269},[248,1074,671],{"class":276},[248,1076,280],{"class":269},[248,1078,676],{"class":269},[248,1080,1081],{"class":276}," focal",[248,1083,280],{"class":269},[248,1085,304],{"class":269},[248,1087,1088],{"class":307},"450x0:550x100",[248,1090,689],{"class":269},[248,1092,692],{"class":269},[248,1094,692],{"class":269},[248,1096,414],{"class":269},[248,1098,1099],{"class":250,"line":447},[248,1100,433],{"class":265},[248,1102,1103],{"class":250,"line":453},[248,1104,439],{"emptyLinePlaceholder":438},[248,1106,1107],{"class":250,"line":459},[248,1108,1109],{"class":265},"\u003C!-- Focus on the bottom of the image -->\n",[248,1111,1112],{"class":250,"line":465},[248,1113,450],{"class":265},[248,1115,1116],{"class":250,"line":471},[248,1117,456],{"class":265},[248,1119,1120],{"class":250,"line":477},[248,1121,1122],{"class":265},"  src=\"https:\u002F\u002Fa.storyblok.com\u002Ff\u002F39898\u002F1000x600\u002Fd962430746\u002Fdemo-image-human.jpeg\"\n",[248,1124,1125],{"class":250,"line":482},[248,1126,1127],{"class":265},"  width=\"600\"\n",[248,1129,1130],{"class":250,"line":487},[248,1131,1132],{"class":265},"  height=\"130\"\n",[248,1134,1135],{"class":250,"line":493},[248,1136,1137],{"class":265},"  :modifiers=\"{ filters: { focal: '450x500:550x600' } }\"\n",[248,1139,1140],{"class":250,"line":498},[248,1141,433],{"class":265},[1143,1144,1145],"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 .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}",{"title":243,"searchDepth":273,"depth":273,"links":1147},[1148],{"id":336,"depth":273,"text":337,"children":1149},[1150,1151,1152,1153,1154,1155],{"id":349,"depth":286,"text":350},{"id":554,"depth":286,"text":555},{"id":703,"depth":286,"text":704},{"id":793,"depth":286,"text":794},{"id":873,"depth":286,"text":874},{"id":979,"depth":286,"text":980},"Nuxt Image internally use Storyblok as static provider.","md",[1159],{"label":1160,"icon":1161,"to":1162,"size":1163},"Source","i-simple-icons-github","https:\u002F\u002Fgithub.com\u002Fnuxt\u002Fimage\u002Fblob\u002Fmain\u002Fsrc\u002Fruntime\u002Fproviders\u002Fstoryblok.ts","xs",{},{"title":172,"description":1156},"wfXfqGtnTts-aT1HQpyX99PSfuVMKgP_yKJ1asfVaLw",[1168,1170],{"title":168,"path":169,"stem":170,"description":1169,"children":-1},"Nuxt Image integration with Sirv media management, transformation and delivery platform.",{"title":176,"path":177,"stem":178,"description":1171,"children":-1},"Nuxt Image with Strapi integration.",1775283770920]