<div class="box">
	🙃 لفّي بينا يادنيا
</div>
body {
	font-family: "Almarai", sans-serif;
	height: 100vh;
	display: grid;
	place-items: center;
	background: #1c212b;
}

.box {
	display: grid;
	place-content: center;
	height: 100px;
	width: 200px;
	border-radius: 6px;
	padding: 20px;
	font-size: 30px;
	background: white;
	transition: all 0.5s linear;
	font-weight: bold;
}

.box:hover {
	// transform: rotate(.25turn); //ربع لفة

	transform: rotate(0.5turn); //نص لفة

	// transform: rotate(2turn); //لفتين
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.