Google fonts are showing up inconsistently

Solution 1:

Just add a , before the serif part in your css.

Here is the working code:

h2 {
  font-family: 'Cormorant Garamond', serif;
}

h3 {
  font-family: 'Roboto Slab', serif;
}

.Card {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: pink
}

img {
  width: 100vh;
  height: auto
}
<link href="https://fonts.googleapis.com/css?family=Cormorant+Garamond|Roboto+Slab" rel="stylesheet">
<div class="Card">
  <img src="https://picsum.photos/200?image=0" />
  <h2>Jester</h2>
  <h3>Prints available upon request.</h3>
</div>

Hope it Helps.

Peace 🖖.