Placeholders

Often you will need placeholder images or content in pages which are under development.

Texture

For patterns / textures, check out Hero Patterns. You can get raw SVGs, or styled components to copy & paste.

Placeholder images

For placeholder images, you can use tools like Lorem Picsum (for more generic images), or placekitten (for cats).

<!-- This tag will get you a random 200x200 image -->
<img src="https://picsum.photos/200/200" alt="Placeholder" />

<!-- This tag will get you a random 200x300 cat -->
<img src="http://placekitten.com/200/300" alt="Placeholder cat" />

Lorem ipsum

Lorem ipsum is the widely known standard for all placeholder text.

To add lorem ipsum to your content, consider using the Emmet lorem tool in VSCode. You will have something similar, or can install Emmet in your favorite editor.

To use this:

<!-- div>ul>(li>lorem5)*5 -->
<!-- This expands to: -->
<div>
    <ul>
        <li>Lorem ipsum dolor sit amet.</li>
        <li>Quae ratione totam vitae architecto!</li>
        <li>Accusantium quae consequuntur ex temporibus.</li>
        <li>Vitae expedita libero hic praesentium.</li>
        <li>Eveniet rem optio eaque suscipit?</li>
    </ul>
</div>