HTML macro

Documentation

Description

HTML (Hypertext Markup Language) is the standard markup language for creating web pages and web applications. It provides the structure for web content by using a system of tags and attributes.

Potential use cases

Creating Web Pages: HTML is used to structure the content of web pages, including text, images, links, and multimedia elements.
Presenting working HTML snippets: show off your ideas with a live preview with functionally working code including CSS

Examples

<style>
    .container {
        display: flex;
        flex-direction: row;
        font-family: Apple-System, Arial, Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', STXihei, sans-serif;
        justify-content: space-around;
        padding: 1rem;
    }

    .container > div {
        background: #DDDDDD;
        border-radius: 8px;
        display: flex;
        flex-direction: column;
        gap: 1rem;
        padding: 2rem;
    }

    .button {
        border: none;
        height: 100px;
        width: 250px;
    }

    .button.v1 {
        background: #ffd000;
        border-radius: 1rem;
        box-shadow: inset 0px 0px 5px 5px #fff080, 0px 10px 0px 0px #ffd000;
        transition: 0.2s;
    }

    .button.v1:hover {
        transform: translate(0, 10px);
        box-shadow: inset 0px 0px 5px 5px #fff080, 0px 0px 0px 0px #ffd000;
    }

    .button.v2 {
        border: 2px solid #EEEEEE;
    }

</style>
<div class="container">
    <div>
        <span>Button Idea number 1</span>
        <div><button class="button v1">Click me</button></div>
    </div>
    <div>
        <span>Button Idea number 1</span>
        <div><button class="button v2">Click me</button></div>
    </div>
</div>