Overview

This template has five colors, eight images, and two gifs you can change on the #aethra ID.

• mainc: The images and first dot (from top to bottom) color.
• secondc: Second dot color (from top to bottom).
• thirdc: Third dot color (from top to bottom).
• fourthc: Fourth dot color (from top to bottom).
• cborder: Line and border of the gifs corlor.
• mimg1 -> mimg8: Images URL from top-left to bottom-right.
• mgif1: URL of the top gif.
• mgif2: URL of the bottom gif.

If you use it more than once on the same page:o change the id #aethra in style and the first div of the HTML.

Preview

Preview mode not available on mobile

Aethra

Brightness; splendor; clear sky

Code

<link rel="stylesheet" type="text/css" href="https://dl.dropbox.com/scl/fi/47v21g1e7o3s9jvqy0sah/aethra.css?rlkey=0chcywqbcvbzvrkr7vprs1v3s&st=shna1cqs&dl=0" />

<style>
    #aethra {
        --mainc: rgb(116, 62, 90, 0.6);
        --secondc: rgba(209, 127, 157, 0.6);
        --thirdc: rgb(94, 69, 72, 0.6);
        --fourthc: rgb(87, 54, 54, 0.6);
        --cborder: #743e5a;

        --mimg1: url(https://i.imgur.com/MRYfiJ3.png);
        --mimg2: url(https://i.imgur.com/ENxuDUf.png);

        --mimg3: url(https://i.imgur.com/PGFzP3n.png);
        --mimg4: url(https://i.imgur.com/AwjIUxA.png);

        --mimg5: url(https://i.imgur.com/vZLQVSZ.png);
        --mimg6: url(https://i.imgur.com/DLQ0qak.png);

        --mimg7: url(https://i.imgur.com/RTXKkjt.png);
        --mimg8: url(https://i.imgur.com/ylGP0JJ.png);

        --mgif1: url(https://i.imgur.com/BoRj3fB.gif);
        --mgif2: url(https://i.imgur.com/kq3SkrL.gif);
    }
</style>

<div id="aethra">
    <div class="wrap_mood">
        <div class="colorbox">
            <div class="color"></div>
            <div class="color" style="background-color: var(--secondc)"></div>
            <div class="color" style="background-color: var(--thirdc)"></div>
            <div class="color" style="background-color: var(--fourthc)"></div>
        </div>

        <div class="gifAet"></div>
        <div class="gifAet" style="top: 180px; left: 170px; background-image: var(--mgif1)"></div>
        <h1>Aethra</h1>
        <h2>Brightness; splendor; clear sky</h2>
        <div class="row">
            <img1> </img1>
            <img1 style="background-image: var(--mimg2)"> </img1>
        </div>

        <div class="row">
            <img1 style="background-image: var(--mimg3)"> </img1>
            <img2> </img2>
        </div>

        <div class="row">
            <img2 style="background-image: var(--mimg5)"> </img2>
            <img1 style="
margin-right: 0px;
margin-left: 10px;
height: 310px;
background-image: var(--mimg6);
">
            </img1>
        </div>

        <div class="row" style="top: -100px">
            <img3> </img3>
            <img3 style="background-image: var(--mimg8)"> </img3>
        </div>

        <a href="https://www.mytinyiglu.com/forum/Ice%20Bear" title="template by: Ice Bear">
            <div class="credito-mmo"></div>
        </a>
    </div>
</div>

Similar Templates

Aethra

Moodboard

Overview

Preview

Aethra

Brightness; splendor; clear sky

Code