There are many sources you could use to find your next hero image but for me Unsplash.com is working perfectly.

The images are free to use for commercial and non-commercial use. No attribution required but it's recommended to credit the photographer so he's getting more exposure to his work.

Finding an image manually

One way to find an image is go to Unsplash.com and use the search field. Once you've found a picture you like - click to preview it.

Then copy the id part of the url (letters at the end of the url) and create the following url https://source.unsplash.com/4hH8MJBQYYE from the following url https://unsplash.com/photos/**4hH8MJBQYYE** - starting with **https://source.unsplash.com/id/**

After loading the source you'll get a url like https://images.unsplash.com/photo-1488310371179-2efa381746d2?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=MnwxfDB8MXxhbGx8fHx8fHx8fHwxNjIxNzE1MjE0&ixlib=rb-1.2.1&q=80&w=1080&utm_source=unsplash_source&utm_medium=referral&utm_campaign=api-credit that you can now use in Contentful as a url.

You could also download it and add it as file but I think the above mentioned way is easier to do.

To avoid writing the url you could also generate a link in your browser with the following script as url to generate the url for you javascript: url = location.href.split('/'); id = url[url.length-1]; location.href = 'https://source.unsplash.com/'+id;

There are more options you could use from the source api from Unsplash. Visit https://source.unsplash.com/ to get an idea of the possibiltities.

Also adding a size option as last url part can be useful by simply adding /400x300 you can request an image with a reduced size of 400px width and 300px height.

Automate with your favorite collection

It's also OK to use https://source.unsplash.com/collection/{collection-id} to pick a random image from your favourite collection. Goto https://unsplash.com/collections find a collection with some images you like and create a bookmark with the source link - so everytime you click the link you'll get a new url you could use as your hero image. e.g. https://source.unsplash.com/collection/167880 will give you a random image from Inspiration Diverse collection.

If you're adding a bookmark in your browser maybe you have to navigate away from the loaded image so another click will load a different image or you could add a small script to the link url so the browser won't cache the request - something like javascript: location.href = 'https://source.unsplash.com/collection/167880/?'+Date.now() will do the trick. The ?1551267961 part will be ignored by unsplash api because it's invalid but the browser will always load a new image with-out caching because at every click you're generating a new url.