<div class="grid">
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
  <div>6</div>
  <div>7</div>
  <div>8</div>
  <div>9</div>
  <div>10</div>
  <div>11</div>
  <div>12</div>
  <div>13</div>
  <div>14</div>
  <div>15</div>
  <div>16</div>
  <div>17</div>
  <div>18</div>
  <div>19</div>
  <div>20</div>
</div>

body {
  background-color: #fff;
  color: #000;
  padding: 80px;
}

.grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}

.grid > * {
  aspect-ratio: 1 / 1;
  transform: rotate(0.1turn);
  background: rgb(63,94,251);
  background: radial-gradient(circle, rgba(63,94,251,1) 0%, rgba(252,70,107,0.5688777464110644) 100%);
  color: #fff;
  font: 200% Arial, Helvetica, sans-serif;
  padding: 20px;
}

.grid > *:nth-child(odd) {
  background: rgb(63,94,251);
background: radial-gradient(circle, rgba(63,94,251,1) 0%, rgba(70,138,252,0.5688777464110644) 100%);
}