diff --git a/apps/client/src/widgets/note_icon.css b/apps/client/src/widgets/note_icon.css
index 70e2f018d..2e2cf3dc0 100644
--- a/apps/client/src/widgets/note_icon.css
+++ b/apps/client/src/widgets/note_icon.css
@@ -129,6 +129,8 @@ body.mobile .modal.icon-switcher {
 
     .modal-body {
         padding: 0;
+        display: flex;
+        flex-direction: column;
 
         > .filter-row {
             padding: 0 var(--bs-modal-padding) var(--bs-modal-padding) var(--bs-modal-padding);
@@ -137,5 +139,7 @@ body.mobile .modal.icon-switcher {
 
     .icon-list {
         margin: auto;
+        flex-grow: 1;
+        height: 100%;
     }
 }
diff --git a/apps/client/src/widgets/note_icon.tsx b/apps/client/src/widgets/note_icon.tsx
index 96c26a8c6..2b78f052e 100644
--- a/apps/client/src/widgets/note_icon.tsx
+++ b/apps/client/src/widgets/note_icon.tsx
@@ -82,6 +82,7 @@ function MobileNoteIconSwitcher({ note, icon }: {
                     size="xl"
                     show={modalShown} onHidden={() => setModalShown(false)}
                     className="icon-switcher note-icon-widget"
+                    scrollable
                 >
                     {note && <NoteIconList note={note} onHide={() => setModalShown(false)} columnCount={Math.floor(windowWidth / 48)} />}
                 </Modal>