CSS Highlight Animation

css-highlight-animation.css

.anim-bg {
	position: relative;
}

.anim-bg::before {
	content: "";
	position: absolute;
	left: -0.2rem; /* Start 0.2rem to the left */
	width: 0%; /* Initial width */
	height: 100%;
	background: yellow;
	z-index: -1;
	animation: swipeEffect 0.6s forwards;
}

@keyframes swipeEffect {
	to {
		width: calc(100% + 0.4rem); /* Extend to 0.2rem beyond both sides */
	}
}