Skip to content

Commit

Permalink
Add info about gatsby-plugin-sharp (#4019)
Browse files Browse the repository at this point in the history
* Add info about gatsby-plugin-sharp

* Update README.md
  • Loading branch information
tulikavijay authored and KyleAMathews committed Feb 13, 2018
1 parent 41d7a7a commit 8c52924
Showing 1 changed file with 7 additions and 1 deletion.
8 changes: 7 additions & 1 deletion packages/gatsby-image/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,9 @@ Speedy, optimized images without the work.
Gatsby's GraphQL queries. It combines
[Gatsby's native image processing](https://image-processing.gatsbyjs.org/)
capabilities with advanced image loading techniques to easily and completely
optimize image loading for your sites.
optimize image loading for your sites. `gatsby-image` uses
[gatsby-plugin-sharp](https://www.gatsbyjs.org/packages/gatsby-plugin-sharp/)
to power its image transformations.

_Warning: gatsby-image is **not** a drop-in replacement for `<img/>`. It's
optimized for fixed width/height images and images that stretch the full-width
Expand Down Expand Up @@ -255,6 +257,10 @@ prop. e.g. `<Img sizes={sizes} />`
| `backgroundColor` | `string\|bool` | Set a colored background placeholder. If true, uses "lightgray" for the color. You can also pass in any valid color string. |
| `onLoad` | `func` | A callback that is called when the full-size image has loaded. |

## Image processing arguments
[gatsby-plugin-sharp](/packages/gatsby-plugin-sharp) supports many additional arguments for transforming your images like
`quality`,`sizeByPixelDensity`,`pngCompressionLevel`,`cropFocus`,`greyscale` and many more. See its documentation for more.

## Some other stuff to be aware of

* If you want to set `display: none;` on a component using a `resolutions` prop,
Expand Down

0 comments on commit 8c52924

Please sign in to comment.