<template>
    <div class="_background:warning-shade-150!">Warning Shade 15%</div>

    <div class="_background:warning-shade-100!">Warning Shade 10%</div>

    <div class="_background:warning-shade-50!">Warning Shade 5%</div>

    <div class="_background:warning!">Warning</div>

    <div class="_background:warning-tint-50!">Warning Tint 5%</div>

    <div class="_background:warning-tint-100!">Warning Tint 10%</div>

    <div class="_background:warning-tint-150!">Warning Tint 15%</div>

    <hr />

    <div class="_background:warning-50!">Warning 5%</div>

    <div class="_background:warning-100!">Warning 10%</div>

    <div class="_background:warning-200!">Warning 20%</div>

    <div class="_background:warning-300!">Warning 30%</div>

    <div class="_background:warning-400!">Warning 40%</div>

    <div class="_background:warning-500!">Warning 50%</div>

    <div class="_background:warning-600!">Warning 60%</div>

    <div class="_background:warning-700!">Warning 70%</div>

    <div class="_background:warning-800!">Warning 80%</div>

    <div class="_background:warning-900!">Warning 90%</div>
</template>
