Для создания блоков с разными размерами при использовании CSS Grid, можно использовать свойство grid-template-columns и grid-template-rows.
Например, чтобы создать блоки с разными размерами, можно задать для grid-template-columns следующее значение: "repeat(3, 1fr 2fr)" - это значит, что у нас будет три колонки, в первой колонке ширина будет 1fr, во второй и третьей - 2fr.
Пример кода:
```css
.container {
display: grid;
grid-template-columns: repeat(3, 1fr 2fr);
grid-template-rows: repeat(3, 100px);
}
.item {
background-color: #f2f2f2;
border: 1px solid #ccc;
}
```
```html
<div class="container">
<div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>
<div class="item">4</div>
<div class="item">5</div>
<div class="item">6</div>
<div class="item">7</div>
<div class="item">8</div>
<div class="item">9</div>
</div>
```
Этот код создаст блоки в виде сетки 3x3, где каждый блок будет иметь разные размеры в зависимости от заданных значений для grid-template-columns.