https://source.unsplash.com/featured?{keyword}

https://source.unsplash.com/collection/928423/480x480
<style>
#weather-icon{
 width:auto;
 height:400px;
 margin-left:auto;
 margin-right:auto;
}
</style>
<p> <img  id="weather-icon" src="https://source.unsplash.com/random/?cat&5">cat</p>
<p> <img  id="weather-icon" src="https://source.unsplash.com/random/?cat&4">cat</p>

<p> <img  id="weather-icon" src="https://source.unsplash.com/collection/1051/1">1</p>
<p> <img  id="weather-icon" src="https://source.unsplash.com/collection/1051/2">2</p>
<p> <img  id="weather-icon" src="https://source.unsplash.com/collection/1051/3">3</p>

<p> <img  id="weather-icon" src="https://source.unsplash.com/1600x900/?donkey,mule&6">cow</p>
<p> <img  id="weather-icon" src="https://source.unsplash.com/1600x900/?donkey,mule&7">cow</p>

<div class="gallery-container"></div>
<script>
const numImagesAvailable = 988  //how many photos are total in the collection
const numItemsToGenerate = 20; //how many photos you want to display
const imageWidth = 480;    //image width in pixels
const imageHeight = 480;   //image height in pixels
//const collectionID = 928423  //Beach & Coastal, the collection ID from the original url
const galleryContainer = document.querySelector('.gallery-container')
function renderGalleryItem(randomNumber){
  fetch(`https://source.unsplash.com/${imageWidth}x${imageHeight}/?&${randomNumber}`)
    .then((response) => {
      let galleryItem = document.createElement('span');
      galleryItem.classList.add('gallery-item');
      galleryItem.innerHTML = `
        <img class="gallery-image" src="${response.url}" alt="gallery image"/>
        `
      galleryContainer.append(galleryItem);
  })
}
for(let i=0; i < numItemsToGenerate; i++){
    let randomImageIndex = Math.floor(Math.random() * numImagesAvailable);
renderGalleryItem(randomImageIndex);
}
</script>
<!--https://source.unsplash.com/collection/${collectionID}/${imageWidth}x${imageHeight}/?sig=${randomNumber}-->
<style>
body {
  margin: 0;
  padding: 0;
  background-color: #f6f6f6;
}
* {
  box-sizing: border-box;
}
img {
  width: 100%;
  height: auto;
}
.gallery-container {
  width: 100vw;
  height: 100vh;
  position: relative;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 10px;
}
.gallery-item {
  width: 240px;
  height: 240px;
  padding: 10px;
  background-color: white;
  box-shadow: 3px 3px 0px 0px rgba(0, 0, 0, 0.1);
  margin: 10px;
}
</style>