-3

[trying to draw these shapes with HTML and CSS][1]

how should I draw them using only HTML and CSS [1]: https://i.stack.imgur.com/8mvdY.png

send me working code if possible

Kaushik Jain
  • 1
  • 3
  • Use `border`... they don't all have to be the same color – Paulie_D May 21 '22 at 11:00
  • Welcome to SO! This isn't a coding service. We're here to troubleshoot existing code and you haven't posted any for us to work with. Please consider reading [ask] and posting a [mre] of what you've attempted. If you haven't attempted anything yet, look into the `border` attribute as Paulie_D mentioned as well as possibly `clip-path`s for the second shape. Once you've made an attempt and gotten stuck, then come back and ask for assistance! :) – AStombaugh May 21 '22 at 11:11

1 Answers1

0

You can replicate those shapes using thick, colored borders.

.shapes{
  box-sizing: border-box;
  width:100px;
  height:100px;
  border-top:red solid 30px;
  border-right:blue solid 30px;
  border-bottom:yellow solid 30px;
  border-left:green solid 30px;
}

.shapes-full-fill{
  box-sizing: border-box;
  width:100px;
  height:100px;
  border-top:red solid 50px;
  border-right:blue solid 50px;
  border-bottom:yellow solid 50px;
  border-left:green solid 50px;
}
<div class="shapes"></div>
<br>
<div class="shapes-full-fill"></div>
Max Tuzenko
  • 1,051
  • 6
  • 18