Чтобы добавить стрелку в раскрывающийся список выбора с помощью CSS, вы можете использовать различные методы. Вот несколько подходов:

1. Псевдоэлементы CSS:

   select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("arrow.png");
    background-repeat: no-repeat;
    background-position: right center;
    padding-right: 20px; /* Adjust as per your requirements */
   }

2. Трюк с границей CSS:

   select {
    padding-right: 20px; /* Adjust as per your requirements */
    background-color: transparent;
    background-image: linear-gradient(45deg, transparent 50%, gray 50%),
                      linear-gradient(135deg, gray 50%, transparent 50%),
                      linear-gradient(to right, gray, gray);
    background-position: calc(100% - 10px) calc(1em + 2px),
                        calc(100% - 5px) calc(1em + 2px),
                        100% 0;
    background-size: 5px 5px, 5px 5px, 2.5em 2.5em;
    background-repeat: no-repeat;
   }

3. Раскрывающийся список пользовательского выбора:

   <div class="custom-select">
    <select>
      <option value="1">Option 1</option>
      <option value="2">Option 2</option>
      <option value="3">Option 3</option>
    </select>
   </div>

   «»;
   позиция: абсолютная;
   сверху: 50%;
   справа: 10 пикселей; /* Отрегулируйте согласно вашим требованиям */
   Transform: TranslateY(-50%);
   Ширина: 0;
   Высота: 0;
   Стиль границы: Solid;
   Ширина границы : 5px 5px 0 5px;
   border-color: #000000 прозрачный прозрачный прозрачный;
   }
   .custom-select select {
   внешний вид: нет;
   -webkit-appearance: нет;
   -moz-appearance: нет;
   отступ справа: 20 пикселей; /* Настраиваем в соответствии с вашими требованиями */
   }