Progress Bar 21

{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"8a3d1d10-21eb-1e9a-1d4a-6e88e52d451a","type":"Block","tag":"div","classes":["04c72b3a-26a4-f8ab-a586-52a6dbd4445c"],"children":["5bac38f5-5a75-649c-4261-e4253808eabb"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"5bac38f5-5a75-649c-4261-e4253808eabb","type":"Block","tag":"div","classes":["04c72b3a-26a4-f8ab-a586-52a6dbd4445d"],"children":["5901b37f-65f5-0442-0cd4-36b3d9843fb5","285f84bb-43e1-7cbb-9878-60e7ecbedb54"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"5901b37f-65f5-0442-0cd4-36b3d9843fb5","type":"Block","tag":"div","classes":["04c72b3a-26a4-f8ab-a586-52a6dbd4445e"],"children":["cc624151-cbc5-ee40-83ce-588a569525e6"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"cc624151-cbc5-ee40-83ce-588a569525e6","type":"Block","tag":"div","classes":["04c72b3a-26a4-f8ab-a586-52a6dbd4445f"],"children":[],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"285f84bb-43e1-7cbb-9878-60e7ecbedb54","type":"Block","tag":"div","classes":["04c72b3a-26a4-f8ab-a586-52a6dbd44460"],"children":[],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}}],"styles":[{"_id":"04c72b3a-26a4-f8ab-a586-52a6dbd4445c","fake":false,"type":"class","name":"progress-bar-21","namespace":"","comb":"","styleLess":"","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"04c72b3a-26a4-f8ab-a586-52a6dbd4445d","fake":false,"type":"class","name":"progress-bar-21_container","namespace":"","comb":"","styleLess":"position: relative; width: 100%; height: 0.5rem;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"04c72b3a-26a4-f8ab-a586-52a6dbd4445e","fake":false,"type":"class","name":"progress-bar-21_progress","namespace":"","comb":"","styleLess":"position: absolute; display: flex; width: 20%; height: 0.5rem; justify-content: flex-start; align-items: center; border-top-style: solid; border-top-width: 0.125rem; border-top-color: #0c60f5; border-right-style: solid; border-right-width: 0.125rem; border-right-color: #0c60f5; border-bottom-style: solid; border-bottom-width: 0.125rem; border-bottom-color: #0c60f5; border-left-style: solid; border-left-width: 0.125rem; border-left-color: #0c60f5; border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; border-bottom-left-radius: 0.5rem; border-bottom-right-radius: 0.5rem; background-color: white;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"04c72b3a-26a4-f8ab-a586-52a6dbd4445f","fake":false,"type":"class","name":"progress-bar-21_decor","namespace":"","comb":"","styleLess":"width: 100%; height: 0.125rem; margin-right: 0.0625rem; margin-left: 0.0625rem; border-top-left-radius: 0.125rem; border-top-right-radius: 0.125rem; border-bottom-left-radius: 0.125rem; border-bottom-right-radius: 0.125rem; background-color: #f6ad12;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null},{"_id":"04c72b3a-26a4-f8ab-a586-52a6dbd44460","fake":false,"type":"class","name":"progress-bar-21_background","namespace":"","comb":"","styleLess":"width: 100%; height: 0.5rem; justify-content: flex-start; align-items: center; border-top-style: solid; border-top-width: 0.125rem; border-top-color: #d6deea; border-right-style: solid; border-right-width: 0.125rem; border-right-color: #d6deea; border-bottom-style: solid; border-bottom-width: 0.125rem; border-bottom-color: #d6deea; border-left-style: solid; border-left-width: 0.125rem; border-left-color: #d6deea; border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; border-bottom-left-radius: 0.5rem; border-bottom-right-radius: 0.5rem; background-color: white;","variants":{},"children":[],"createdBy":"5fcce66bbffdd37054e18b58","origin":null,"selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0,"universalBindingsRemovedCount":0,"unlinkedSymbolCount":0}}
Built by hand with
from
Piixel Media