You can not get this with a box-shadow, as far as I know.
You can get it with a pseudo element:
.test {
height: 50px;
width: 50px;
background-color: rgba(0, 0, 0, 0.5);
position: relative;
}
.test:after {
content: "";
width: 100%;
height: 100%;
left: 20px;
top: 20px;
background-color: red;
box-shadow: 0px 0px 5px red;
position: absolute;
z-index: -1;
}
I have set a shadow in the pseudo element only for the blurring. The other shadow properties go to the left and top properties of the pseudo element.