# Icons

```html
@example
<div class="sg-icon-wrapper">
    <div class="sg-icon"><div class="sg-icon__icon"><i class="icon icon--chevron-down"></i></div><div class="sg-icon__description">icon--chevron-down</div></div>
    <div class="sg-icon"><div class="sg-icon__icon"><i class="icon icon--chevron-up"></i></div><div class="sg-icon__description">icon--chevron-up</div></div>
    <div class="sg-icon"><div class="sg-icon__icon"><i class="icon icon--chevron-left"></i></div><div class="sg-icon__description">icon--chevron-left</div></div>
    <div class="sg-icon"><div class="sg-icon__icon"><i class="icon icon--chevron-right"></i></div><div class="sg-icon__description">icon--chevron-right</div></div>
</div>
```

```html
@code
<i class="icon icon--name"></i>
```