.iconCircle {
    background: lightblue;
    border-radius: 50%;
    width: 10px;
    height: 10px;
}

    .iconCircle.green {
        background-color: #009865
    }

    .iconCircle.yellow {
        background-color: #fffb26
    }

    .iconCircle.orange {
        background-color: #ff9734
    }

    .iconCircle.red {
        background-color: #ca0034
    }

    .iconCircle.purple {
        background-color: #670099
    }

    .iconCircle.brown {
        background-color: #7e0123
    }

.iconSquare {
    background: lightblue;
    width: 10px;
    height: 10px;
}

    .iconSquare.green {
        background-color: #009865
    }

    .iconSquare.yellow {
        background-color: #fffb26
    }

    .iconSquare.orange {
        background-color: #ff9734
    }

    .iconSquare.red {
        background-color: #ca0034
    }

    .iconSquare.purple {
        background-color: #670099
    }

    .iconSquare.brown {
        background-color: #7e0123
    }

.iconTriangle {
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 0 12px 20px 12px;
    border-color: transparent transparent #FF4532 transparent;
    transform: rotate(0deg);
}

    .iconTriangle.green {
        background-color: transparent;
        border-color: transparent transparent #009865 transparent
    }

    .iconTriangle.yellow {
        background-color: transparent;
        border-color: transparent transparent #fffb26 transparent
    }

    .iconTriangle.orange {
        background-color: transparent;
        border-color: transparent transparent #ff9734 transparent
    }

    .iconTriangle.red {
        background-color: transparent;
        border-color: transparent transparent #ca0034 transparent
    }

    .iconTriangle.purple {
        background-color: transparent;
        border-color: transparent transparent #670099 transparent
    }

    .iconTriangle.brown {
        background-color: transparent;
        border-color: transparent transparent #7e0123 transparent
    }