# C2 Image
### Overview
C2 image is a way to load desktop/mobile images that swap using picture. Lazy loading enabled by default and aspect ratios for desktop and mobile images are built in.

### Props
| Props                 | Type        | Default     |
| --------------------- | ----------- | ----------- |
| dontLazyLoad          | Boolean     | false       |
| height                | Number      |             |
| width                 | Number      |             |
| alt                   | String      |             |
| aspectRatio           | String      |             |
| aspectRatioMobile     | String      |             |
| src                   | String      |             |
| mediaBreakpoint       | String      |             |
| mobileSrc             | String      |             |
| imageClasses          | String      |             |
| imageFit              | String      |             |


### Code snippet
```
    <c2-image
        :dont-lazy-load="true"
        :aspect-ratio="'4/1'"
        :aspect-ratio-mobile="'1/1'"
        :src="'http://www.fillmurray.com/g/800/200'"
        :mobile-src="'http://www.fillmurray.com/g/300/300'"
        :alt="'Bill Murray'"
    />
```