barber's pole
Tags: frontendchallenge, devchallenge, css
Published: 2024-05-31 23:04:22

_This is a submission for [Frontend Challenge v24.04.17](https://dev.to/challenges/frontend-2024-05-29), CSS Art: June._

## Inspiration
<!-- What are you highlighting today? -->
A barber's pole

## Demo 
<!-- Show us your CSS Art! You can directly embed an editor into this post (see the FAQ section of the challenge page) or you can share an image of your project and share a public link to the code. -->
{% embed https://codesandbox.io/p/sandbox/barberpole-wgqlty?file=%2Findex.html%3A67%2C26&layout=%257B%2522sidebarPanel%2522%253A%2522EXPLORER%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522clwv5wqa20006286947ysgzq1%2522%252C%2522sizes%2522%253A%255B100%252C0%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522clwv5wqa200022869e4s20kjf%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522clwv5wqa200032869iioia7i0%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522clwv5wqa200052869pbjhstvq%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B64.49654783313063%252C35.503452166869366%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522clwv5wqa200022869e4s20kjf%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clwv5wqa200012869sgrermtj%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252Findex.html%2522%252C%2522state%2522%253A%2522IDLE%2522%252C%2522initialSelections%2522%253A%255B%257B%2522startLineNumber%2522%253A67%252C%2522startColumn%2522%253A26%252C%2522endLineNumber%2522%253A67%252C%2522endColumn%2522%253A26%257D%255D%257D%255D%252C%2522id%2522%253A%2522clwv5wqa200022869e4s20kjf%2522%252C%2522activeTabId%2522%253A%2522clwv5wqa200012869sgrermtj%2522%257D%252C%2522clwv5wqa200052869pbjhstvq%2522%253A%257B%2522id%2522%253A%2522clwv5wqa200052869pbjhstvq%2522%252C%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clwv5wqa200042869u68r8i49%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522UNASSIGNED_PORT%2522%252C%2522port%2522%253A0%252C%2522path%2522%253A%2522%252F%2522%257D%255D%252C%2522activeTabId%2522%253A%2522clwv5wqa200042869u68r8i49%2522%257D%252C%2522clwv5wqa200032869iioia7i0%2522%253A%257B%2522tabs%2522%253A%255B%255D%252C%2522id%2522%253A%2522clwv5wqa200032869iioia7i0%2522%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Afalse%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A15%257D %}

## Journey 
<!-- Tell us about your process, what you learned, anything you are particularly proud of, what you hope to do next, etc. -->
I don't usually do anything creative with css, but when I do, it's super random.

Just kidding, I just learnt what it's called (the barber's pole thing) and read some history on [wikipedia](https://en.wikipedia.org/wiki/Barber%27s_pole) about it, then looked at the gif for too long, and the idea to make css art out of it just came up. Then I somehow ended up here, on dev.to and saw this challenge thing

<!-- Team Submissions: Please pick one member to publish the submission and credit teammates by listing their DEV usernames directly in the body of the post. -->

<!-- We encourage you to consider adding a license for your code. -->

<!-- Don't forget to add a cover image to your post (if you want). -->

<!-- Thanks for participating! -->