Playing with CSS clip-path polygon()

mattymaloney profile image mattymaloney ・1 min read

While reviewing material to take the Comptia Network+ and Security+ exams, I saw the TCP/IP and OSI network models side by side. Distractible as I am, I immediately thought this might be a good time to play with CSS clip-paths.

For more information on multi-shape clip-paths, see https://24ways.org/2018/clip-paths-know-no-bounds/.

I think I can make improvements to the invisible polygons I chose for "move to next shape". However, after experimenting with what I thought were ideal invisible shapes designed to move to the starting point of the next polygon, I realized that it doesn't seem to matter what coordinates I choose for the invisible polygons. I'm confused about that. Please leave a comment if you can help me understand this.


markdown guide