Shade box

shade-box.css

:root {
    --gradient-1:linear-gradient(to bottom right,#1f005c,#5b0060,#870160,#ac255e,#ca485c,#e16b5c,#f39060,#ffb56b);
}
.box {
    inline-size: 50vmin;
    block-size: 50vmin;
}

html {
    block-size: 100%;
}

body {
    min-block-size: 100%;
    display: grid;
    place-content: center;
}

.gradient-border {
    border: 2rem solid rebeccapurple;
    border-image: var(--gradient-1) 1;
}