extra-dense.py

from nicegui import ui

ui.add_head_html('''
<style>
.extra-compact, .extra-compact .q-field__control, .extra-compact .q-field__append, .extra-compact .q-field__control--addon {
    height: 30px !important;
    max-height: 30px !important;
    min-height: 30px !important;
    align-items: center;
}
.q-field__control-container {
    display: flex;
    align-items: center;
}
.extra-compact .q-field__label {
    top: 6px !important;
}
</style>
''', shared=True)

with ui.card().classes("bg-gray-200"):
    ui.label("Normal select")
    ui.select(options=["Option 1", "Option 2", "Option 3"], value="Option 2").classes("bg-white")
    ui.label("Dense select")
    ui.select(options=["Option 1", "Option 2", "Option 3"], value="Option 2").classes("bg-white").props("dense")
    ui.label("evnchn's extra compact select")
    ui.select(options=["Option 1", "Option 2", "Option 3"], value="Option 2").classes("bg-white extra-compact").props("dense")

ui.run()