[{"_path":"/providers/netlify","_draft":false,"_partial":false,"_empty":false,"title":"Netlify","description":"Optimize images with Netlify's dynamic image transformation service","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Netlify offers dynamic image transformation for all JPEG, PNG, and GIF files you have set to be tracked with "},{"type":"element","tag":"a","props":{"href":"https://docs.netlify.com/large-media/overview/","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Netlify Large Media"}]},{"type":"text","value":"."}]},{"type":"element","tag":"alert","props":{"type":"warning"},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Before setting "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"provider: 'netlify'"}]},{"type":"text","value":", make sure you have followed the steps to enable "},{"type":"element","tag":"a","props":{"href":"https://docs.netlify.com/large-media/overview/","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Netlify Large Media"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"h2","props":{"id":"modifiers"},"children":[{"type":"text","value":"Modifiers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In addition to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"height"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"width"}]},{"type":"text","value":", the Netlify provider supports the following modifiers:"}]},{"type":"element","tag":"h3","props":{"id":"fit"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Default"}]},{"type":"text","value":": "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"contain"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Valid options"}]},{"type":"text","value":": "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"contain"}]},{"type":"text","value":" (equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nf_resize=fit"}]},{"type":"text","value":") and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fill"}]},{"type":"text","value":" (equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nf_resize=smartcrop"}]},{"type":"text","value":")"}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Netlify offers dynamic image transformation for all JPEG, PNG, and GIF files you have set to be tracked with "},{"type":"element","tag":"a","props":{"href":"https://docs.netlify.com/large-media/overview/","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Netlify Large Media"}]},{"type":"text","value":"."}]},{"type":"element","tag":"alert","props":{"type":"warning"},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Before setting "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"provider: 'netlify'"}]},{"type":"text","value":", make sure you have followed the steps to enable "},{"type":"element","tag":"a","props":{"href":"https://docs.netlify.com/large-media/overview/","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Netlify Large Media"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"h2","props":{"id":"modifiers"},"children":[{"type":"text","value":"Modifiers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In addition to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"height"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"width"}]},{"type":"text","value":", the Netlify provider supports the following modifiers:"}]},{"type":"element","tag":"h3","props":{"id":"fit"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Default"}]},{"type":"text","value":": "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"contain"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Valid options"}]},{"type":"text","value":": "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"contain"}]},{"type":"text","value":" (equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nf_resize=fit"}]},{"type":"text","value":") and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fill"}]},{"type":"text","value":" (equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nf_resize=smartcrop"}]},{"type":"text","value":")"}]}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"modifiers","depth":2,"text":"Modifiers","children":[{"id":"fit","depth":3,"text":"fit"}]}]}},"_type":"markdown","_id":"content:4.providers:netlify.md","_source":"content","_file":"4.providers/netlify.md","_extension":"md"},{"_path":"/providers/sanity","_draft":false,"_partial":false,"_empty":false,"title":"Sanity","description":"Nuxt Image has first class integration with Sanity","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Integration between "},{"type":"element","tag":"a","props":{"href":"https://www.sanity.io/docs/image-urls","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Sanity"}]},{"type":"text","value":" and Nuxt Image."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To use this provider you just need to specify the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"projectId"}]},{"type":"text","value":" of your project in Sanity."}]},{"type":"element","tag":"code","props":{"code":"export default {\n  image: {\n    sanity: {\n      projectId: 'yourprojectid',\n      // Defaults to 'production'\n      // dataset: 'development'\n    }\n  }\n}\n","filename":"nuxt.config.js","language":"js"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export default {\n  image: {\n    sanity: {\n      projectId: 'yourprojectid',\n      // Defaults to 'production'\n      // dataset: 'development'\n    }\n  }\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"modifiers"},"children":[{"type":"text","value":"Modifiers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The Sanity provider supports a number of additional modifiers. For a full list, check out "},{"type":"element","tag":"a","props":{"href":"https://www.sanity.io/docs/image-urls","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"the Sanity documentation"}]},{"type":"text","value":". All of the modifiers mentioned in the Sanity docs are supported, with the following notes."}]},{"type":"element","tag":"h3","props":{"id":"extra-convenience-modifiers"},"children":[{"type":"text","value":"Extra convenience modifiers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The following more readable modifiers are also supported:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"background"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"bg"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"download"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"dl"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sharpen"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sharp"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"orientation"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"or"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"minHeight"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"min-height"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"min-h"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"maxHeight"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"max-height"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"max-h"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"minWidth"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"min-width"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"min-w"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"maxWidth"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"max-width"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"max-w"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"saturation"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sat"}]}]}]},{"type":"element","tag":"h3","props":{"id":"fit"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In addition to the values specified in the Sanity docs, which are respected, the following options from the "},{"type":"element","tag":"a","props":{"href":"/components/nuxt-img#fit"},"children":[{"type":"text","value":"default fit behavior"}]},{"type":"text","value":" are supported:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"cover"}]},{"type":"text","value":" - this will behave like the Sanity modifier "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"crop"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"contain"}]},{"type":"text","value":" - this will behave like the Sanity modifier "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fill"}]},{"type":"text","value":", and defaults to filling with a white background. (You can specify your own background color with the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"background"}]},{"type":"text","value":" modifier.)"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"inside"}]},{"type":"text","value":" - this will behave like the Sanity modifier "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"min"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"outside"}]},{"type":"text","value":" - this will behave like the Sanity modifier "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"max"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fill"}]},{"type":"text","value":" - this will behave like the Sanity modifier "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"scale"}]}]}]},{"type":"element","tag":"alert","props":{"type":"warning"},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For compatibility with other providers, "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit: fill"}]},{"type":"text","value":" is equivalent to the Sanity parameter "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"?fit=scale"}]},{"type":"text","value":". If you need the Sanity "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"?fit=fill"}]},{"type":"text","value":" behavior, use "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit: contain"}]},{"type":"text","value":" instead."}]}]},{"type":"element","tag":"h3","props":{"id":"format"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"format"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can specify any of the formats suppored by Sanity. If this is omitted, the Sanity provider will default to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"auto=format"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"crop-and-hotspot"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"crop"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"hotspot"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can pass your Sanity crop and hotspot image data as modifiers and Nuxt Image will correctly generate the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"rect"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fp-x"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fp-y"}]},{"type":"text","value":" parameters for you."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Integration between "},{"type":"element","tag":"a","props":{"href":"https://www.sanity.io/docs/image-urls","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Sanity"}]},{"type":"text","value":" and Nuxt Image."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To use this provider you just need to specify the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"projectId"}]},{"type":"text","value":" of your project in Sanity."}]},{"type":"element","tag":"code","props":{"code":"export default {\n  image: {\n    sanity: {\n      projectId: 'yourprojectid',\n      // Defaults to 'production'\n      // dataset: 'development'\n    }\n  }\n}\n","filename":"nuxt.config.js","language":"js"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6119c3"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-6119c3"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-595ded"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-595ded"},"children":[{"type":"text","value":"sanity"}]},{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-595ded"},"children":[{"type":"text","value":"projectId"}]},{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-5f273b"},"children":[{"type":"text","value":"'yourprojectid'"}]},{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-d200c3"},"children":[{"type":"text","value":"// Defaults to 'production'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-d200c3"},"children":[{"type":"text","value":"// dataset: 'development'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":"    }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":"  }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-94bf12"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"modifiers"},"children":[{"type":"text","value":"Modifiers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The Sanity provider supports a number of additional modifiers. For a full list, check out "},{"type":"element","tag":"a","props":{"href":"https://www.sanity.io/docs/image-urls","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"the Sanity documentation"}]},{"type":"text","value":". All of the modifiers mentioned in the Sanity docs are supported, with the following notes."}]},{"type":"element","tag":"h3","props":{"id":"extra-convenience-modifiers"},"children":[{"type":"text","value":"Extra convenience modifiers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The following more readable modifiers are also supported:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"background"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"bg"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"download"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"dl"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sharpen"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sharp"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"orientation"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"or"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"minHeight"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"min-height"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"min-h"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"maxHeight"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"max-height"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"max-h"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"minWidth"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"min-width"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"min-w"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"maxWidth"}]},{"type":"text","value":" or "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"max-width"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"max-w"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"saturation"}]},{"type":"text","value":" - equivalent to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"sat"}]}]}]},{"type":"element","tag":"h3","props":{"id":"fit"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In addition to the values specified in the Sanity docs, which are respected, the following options from the "},{"type":"element","tag":"a","props":{"href":"/components/nuxt-img#fit"},"children":[{"type":"text","value":"default fit behavior"}]},{"type":"text","value":" are supported:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"cover"}]},{"type":"text","value":" - this will behave like the Sanity modifier "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"crop"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"contain"}]},{"type":"text","value":" - this will behave like the Sanity modifier "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fill"}]},{"type":"text","value":", and defaults to filling with a white background. (You can specify your own background color with the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"background"}]},{"type":"text","value":" modifier.)"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"inside"}]},{"type":"text","value":" - this will behave like the Sanity modifier "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"min"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"outside"}]},{"type":"text","value":" - this will behave like the Sanity modifier "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"max"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fill"}]},{"type":"text","value":" - this will behave like the Sanity modifier "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"scale"}]}]}]},{"type":"element","tag":"alert","props":{"type":"warning"},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For compatibility with other providers, "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit: fill"}]},{"type":"text","value":" is equivalent to the Sanity parameter "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"?fit=scale"}]},{"type":"text","value":". If you need the Sanity "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"?fit=fill"}]},{"type":"text","value":" behavior, use "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit: contain"}]},{"type":"text","value":" instead."}]}]},{"type":"element","tag":"h3","props":{"id":"format"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"format"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can specify any of the formats suppored by Sanity. If this is omitted, the Sanity provider will default to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"auto=format"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"crop-and-hotspot"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"crop"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"hotspot"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can pass your Sanity crop and hotspot image data as modifiers and Nuxt Image will correctly generate the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"rect"}]},{"type":"text","value":", "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fp-x"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fp-y"}]},{"type":"text","value":" parameters for you."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-d200c3{color:#7F848E}.ct-5f273b{color:#98C379}.ct-595ded{color:#E06C75}.ct-94bf12{color:#ABB2BF}.ct-6119c3{color:#C678DD}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"modifiers","depth":2,"text":"Modifiers","children":[{"id":"extra-convenience-modifiers","depth":3,"text":"Extra convenience modifiers"},{"id":"fit","depth":3,"text":"fit"},{"id":"format","depth":3,"text":"format"},{"id":"crop-and-hotspot","depth":3,"text":"crop and hotspot"}]}]}},"_type":"markdown","_id":"content:4.providers:sanity.md","_source":"content","_file":"4.providers/sanity.md","_extension":"md"}]