CSS: How do I create a narrow left and right arrow?

.eicon-chevron-right::before {
   font-family: "Font Awesome 5 Free";
   content: "" !important;
   width: 35px;
   height: 35px;
   border-color: #000;
   display: inline-block;
   border-bottom: 2px solid;
   border-left: 2px solid;
   -webkit-transition: all 0.5s ease;
   -moz-transition: all 0.5s ease;
   -o-transition: all 0.5s ease;
   -ms-transition: all 0.5s ease;
   transition: all 0.5s ease;
   -ms-transform: rotate(225deg);
   -webkit-transform: rotate(225deg);
   margin-right:10px;
}
.eicon-chevron-left::before {
   font-family: "Font Awesome 5 Free";
   content: "" !important;
   width: 35px;
   height: 35px;
   border-color: #000;
   border-bottom-color: rgb(0, 0, 0);
   border-left-color: rgb(0, 0, 0);
   display: inline-block;
   border-bottom: 2px solid;
   border-left: 2px solid;
   -webkit-transition: all 0.5s ease;
   -moz-transition: all 0.5s ease;
   -o-transition: all 0.5s ease;
   -ms-transition: all 0.5s ease;
   transition: all 0.5s ease;
   -ms-transform: rotate(45deg);
   -webkit-transform: rotate(45deg);
   transform: rotate(45deg);
   margin-left:10px;
}