How to create the hr tag effect in the personal portfolio website?

1

So here’s the link to the personal website created by freecodecamp


can you explain me how to create the hr tag effect in the ABOUT section

2

Hi! :slight_smile:

I think it is basically a combination of two things -

  1. CSS Shapes
  2. Pseudo Elements

So basically you create a CSS shape for the ::after or the ::before pseudo elements and then position it based on your requirements.

3

Thanks for the CSS Shapes link, there are some really cool tricks in it but the effect the OP is interested in is easier than that. You just use an icon font like Font Awesome.