Custom bullet points in Webflow
Hey guys, I was wondering if anyone figured out how to make a custom bullet point in Webflow. By custom, I mean how to replace the bullet point with an SVG or PNG. I find Webflow's stock options quite boring. Thanks!
3 Replies
With some custom css you could get this done! Check out this article:
https://web.dev/articles/css-marker-pseudo-element
web.dev
Custom bullets with CSS ::marker | Articles | web.dev
It is now trivial to customize the color, size or type of number or bullet when using a
or .You can use a custom code or remove the html bullet and replace with some background image.
https://discourse.webflow.com/t/how-to-replace-list-bullets-to-custom-icons-svg/89820
Forum | Webflow
How to replace List Bullets to custom icons (SVG)
Less than 1 min. UL - List Step 1 Add list: https://university.webflow.com/article/lists Step 2 - Remove bullets: list-style-type: none; Step 3: Remove ul default padding LI - List item Step1 - Add left padding (room for the icon) Step2 - Set background image Use SVG (Better than png) - without any extra space around. Left: ...
Sweet I got it now. Thanks guys!