Introduction Writing Guidelines Colors & Icons Javascript Forms Grid Blankslate Avatars Buttons Alerts Modals Tooltips Panels Popovers Tables Navigation Utilities & Markdown Miscellaneous

# Blankslate

Blankslates are for when there is a lack of content within a page or section. Use them as placeholders to tell users why something isn’t there. Be sure to provide an action to add content as well.

### Basic example

Wrap some content in the outer `.blankslate` wrapper to give it the blankslate appearance.

### This is a blank slate

Use it to provide information when no dynamic content exists.

    <div class="blankslate">
        <div class="icon"><i class="octicon octicon-book"></i></div>
        <h3>This is a blank slate</h3>
        <p>Use it to provide information when no dynamic content exists.</p>
    </div>

### With some background

### This is a blank slate

Use it to provide information when no dynamic content exists.

    <div class="blankslate with-background">
        <div class="icon"><i class="octicon octicon-book"></i></div>
        <h3>This is a blank slate</h3>
        <p>Use it to provide information when no dynamic content exists.</p>
    </div>

### Full width

Container will occupy the entire available width.

### This is a blank slate

Use it to provide information when no dynamic content exists.

    <div class="blankslate with-background full-width">
        <div class="icon"><i class="octicon octicon-book"></i></div>
        <h3>This is a blank slate</h3>
        <p>Use it to provide information when no dynamic content exists.</p>
    </div>