$count: 7;

$list: pink, #ffcc00, #795548, #49ed49, #0c2626, #9c27b0, purple;

​

html,

body {

    width: 100%;

    height: 100%;

    display: flex;

}

​

.flex-box {

    margin: auto;

    width: 100vw;

    height: 200px;

    display: flex;

    justify-content: space-between;

    flex-wrap: nowrap;

}

​

.box {

    flex: 1 1 auto;

    height: 200px;

    margin: 5px;

}

​

@for $i from 1 to $count {

    .box:nth-child(#{$i}) {

        background: nth($list, $i);

    }

}

​

p {

    color: #fff;

    line-height: 60px;

    font-size: 18px;

    padding: 5px;

    mix-blend-mode: difference;

}