Posted on • Edited on
The is a basic form element that allows users to choose one option from a list. But the default look, especially the arrow, doesn’t fit modern UIs. In this article you will learn how to disable the default arrow in a using CSS and how to add your own custom select arrow using SVG and the data:image property. This will make your forms look more modern and consistent.
See the following Codepen for a demo:
Full article: Custom Select Arrow using CSS
CSS Snippets
For further actions, you may consider blocking this person and/or reporting abuse
Generate dynamic JSON-driven forms directly in your JavaScript app (Angular, React, Vue.js, jQuery) with a fully customizable drag-and-drop form builder. Easily integrate with any backend system and retain full ownership over your data, with no user or form submission limits.
Dhaval Upadhyay -
Aarav Joshi -
Brian Keary -
DPC -
Top comments (0)