If code blocks in the output document are potentially distracting to readers, you may choose to fold them initially. Readers can then choose to display them by clicking the fold buttons:

output:
  html_document:
    code_folding: hide

You can also choose to unfold all code blocks initially (so readers can choose to fold them later):

output:
  html_document:
    code_folding: show

If you fold all code blocks initially, you can specify certain blocks to be unfolded initially with the chunk option class.source = "fold-show", e.g.,

---
title: Hide all code blocks and show some initially
output:
  html_document:
    code_folding: hide
---
```{r}
1  # code is hidden initially
```
```{r class.source = 'fold-show'}
2  # code is shown initially
```
```{r}
3  # also hidden
```

You can also do it the other way around, i.e., show all code blocks but hide some of them initially. For example:

---
output:
  html_document:
    code_folding: show
---
```{r}
1  # code is shown initially
```
```{r class.source = 'fold-hide'}
2  # code is hidden initially
```

code_folding will control the hide and show behavior for R code chunks but also for some other languages by default (r, python, bash, sql, cpp, stan, and julia). If this is a limitation for you, it can be extended to apply to any language code source block by adding the class foldable via the chunk option class.source, or even setting it globally so that it applies on any code chunk using knitr::opts_chunk$set(class.source = "foldable").

---
title: Hide CSS code chunk
output: 
  html_document:
    code_folding: hide
---
This is a CSS chunk using the `css` chunk engine, and it can't be hidden even if
`code_folding = 'hide'`.
```{css}
pre {
  background-color: lightblue;
}
```
But it can if you add the `foldable` class to the chunk source code. 
```{css, class.source = 'foldable'}
pre.foldable {
  background-color: lightgreen;
}
```