css

Bash

/* 見出しを見やすくする */
/* 見出し共通 */
h1,
h2,
h3,
h4 {
    position: relative;
    padding-bottom: 0.4em;
    margin-top: 1.5em;
    margin-bottom: 1em;
}

/* 下線共通 */
h1::after,
h2::after,
h3::after,
h4::after {
    content: "";
    position: absolute;

    left: 0;
    bottom: 0;

    height: 2px;

    /* 水色グラデーション */
    background: linear-gradient(
        to right,
        #38bdf8,
        rgba(56, 189, 248, 0.25)
    );
}

/* h1 = 6/6 */
h1::after {
    width: 100%;
}

/* h2 = 5/6 */
h2::after {
    /* width: 83.333%; */
    width: 75%;
}

/* h3 = 4/6 */
h3::after {
    /* width: 66.666%; */
    width: 50%;
}

/* h4 = 3/6 */
h4::after {
    /* width: 50%; */
    width: 25%;
}