Blur Siblings on Hover

When hovering over a group, all items blur except the one being hovered. Focuses attention on the active item. Pure CSS, works with any number of children.

.blur-group:hover > * {
  filter: blur(3px);
  opacity: 0.5;
  transition: all 0.3s;
}
.blur-group:hover > *:hover {
  filter: blur(0);
  opacity: 1;
}