Learn How to Make Heart Shape using CSS Only
<html>
<head>
<title>Shape</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/style.css"/>
</head>
<body>
<div class="container">
<div class="heart-shape"></div>
</div>
</body>
</html>
body{
margin:0;
}
*{
box-sizing: border-box;
}
.container{
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.heart-shape{
width: 200px;
height: 200px;
background-color: red;
position: relative;
transform: rotate(45deg);
}
.heart-shape:before, .heart-shape:after{
width: 200px;
height: 200px;
background-color: red;
content: '';
position: absolute;
border-radius: 50%;
}
.heart-shape::before{
bottom: 0px;
left: -100px;
}
.heart-shape::after{
bottom: 0px;
top: -100px;
}
https://youtu.be/0RRUOIvmuWA I realized that I had my camera set up incorrectly, so when I upload…
https://youtu.be/C3oFfV20K_c Make Animated progress step bar using Figma
https://youtu.be/o3pSH_oRzko How to Hide All Grids in Figma
https://youtu.be/hdSUylKSsho How to Create Responsive Tool tip in Figma
https://youtu.be/AEiH7dSDhKo Having issue in figma pixel grid? learn how to show/ hide figma pixel grid…
https://youtu.be/iilYzHg9LwQ There are some issues going on in ventura OS its still in development phase…