diff --git a/components/auto-complete/auto-complete-item.tsx b/components/auto-complete/auto-complete-item.tsx
index 6d6fb08..a78c315 100644
--- a/components/auto-complete/auto-complete-item.tsx
+++ b/components/auto-complete/auto-complete-item.tsx
@@ -39,7 +39,7 @@ const AutoCompleteItem: React.FC<React.PropsWithChildren<AutoCompleteItemProps>>
 
   return (
     <div className={`item ${isActive ? 'active' : ''}`} onClick={selectHandler}>
-      <Ellipsis>{children}</Ellipsis>
+      <Ellipsis height={`calc(1.688 * ${theme.layout.gap})`}>{children}</Ellipsis>
       <style jsx>{`
         .item {
           display: flex;
@@ -48,8 +48,8 @@ const AutoCompleteItem: React.FC<React.PropsWithChildren<AutoCompleteItemProps>>
           font-weight: normal;
           white-space: pre;
           font-size: ${fontSize};
-          padding: ${theme.layout.gapHalf};
-          line-height: 1.2;
+          padding: 0 ${theme.layout.gapHalf};
+          height: calc(1.688 * ${theme.layout.gap});
           background-color: ${theme.palette.background};
           color: ${theme.palette.foreground};
           user-select: none;
diff --git a/components/select/__tests__/__snapshots__/index.test.tsx.snap b/components/select/__tests__/__snapshots__/index.test.tsx.snap
index e3213eb..bbe80b0 100644
--- a/components/select/__tests__/__snapshots__/index.test.tsx.snap
+++ b/components/select/__tests__/__snapshots__/index.test.tsx.snap
@@ -6,6 +6,7 @@ exports[`Select should render correctly 1`] = `
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: calc(1.688 * 16pt);
           min-width: 0;
         }
       </style></span></span><div class=\\"icon\\"><svg viewBox=\\"0 0 24 24\\" width=\\"1.25em\\" height=\\"1.25em\\" stroke-width=\\"1\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" fill=\\"none\\" shape-rendering=\\"geometricPrecision\\"><path d=\\"M6 9l6 6 6-6\\"></path><style>
@@ -93,6 +94,7 @@ exports[`Select should render correctly 1`] = `
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: calc(1 * 16pt);
           min-width: 0;
         }
       </style></span></span><div class=\\"icon\\"><svg viewBox=\\"0 0 24 24\\" width=\\"1.25em\\" height=\\"1.25em\\" stroke-width=\\"1\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" fill=\\"none\\" shape-rendering=\\"geometricPrecision\\"><path d=\\"M6 9l6 6 6-6\\"></path><style>
@@ -180,6 +182,7 @@ exports[`Select should render correctly 1`] = `
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: calc(1.344 * 16pt);
           min-width: 0;
         }
       </style></span></span><div class=\\"icon\\"><svg viewBox=\\"0 0 24 24\\" width=\\"1.25em\\" height=\\"1.25em\\" stroke-width=\\"1\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" fill=\\"none\\" shape-rendering=\\"geometricPrecision\\"><path d=\\"M6 9l6 6 6-6\\"></path><style>
@@ -267,6 +270,7 @@ exports[`Select should render correctly 1`] = `
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: calc(2 * 16pt);
           min-width: 0;
         }
       </style></span></span><div class=\\"icon\\"><svg viewBox=\\"0 0 24 24\\" width=\\"1.25em\\" height=\\"1.25em\\" stroke-width=\\"1\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" fill=\\"none\\" shape-rendering=\\"geometricPrecision\\"><path d=\\"M6 9l6 6 6-6\\"></path><style>
@@ -358,6 +362,7 @@ exports[`Select should work correctly with labels 1`] = `
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: calc(1.688 * 16pt);
           min-width: 0;
         }
       </style></span></span><div class=\\"icon\\"><svg viewBox=\\"0 0 24 24\\" width=\\"1.25em\\" height=\\"1.25em\\" stroke-width=\\"1\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" fill=\\"none\\" shape-rendering=\\"geometricPrecision\\"><path d=\\"M6 9l6 6 6-6\\"></path><style>
@@ -467,6 +472,7 @@ initialize {
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: calc(1.688 * 16pt);
           min-width: 0;
         }
       ",
@@ -708,6 +714,7 @@ initialize {
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: calc(1.688 * 16pt);
           min-width: 0;
         }
       ",
@@ -817,6 +824,7 @@ initialize {
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: calc(1.688 * 16pt);
           min-width: 0;
         }
       ",
@@ -1130,6 +1138,7 @@ initialize {
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: calc(1.688 * 16pt);
           min-width: 0;
         }
       ",
@@ -1316,6 +1325,7 @@ initialize {
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: calc(1.688 * 16pt);
           min-width: 0;
         }
       ",
diff --git a/components/select/__tests__/__snapshots__/multiple.test.tsx.snap b/components/select/__tests__/__snapshots__/multiple.test.tsx.snap
index 171bea8..9a2b50b 100644
--- a/components/select/__tests__/__snapshots__/multiple.test.tsx.snap
+++ b/components/select/__tests__/__snapshots__/multiple.test.tsx.snap
@@ -6,6 +6,7 @@ exports[`Select Multiple should render correctly 1`] = `
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: calc(1.688 * 16pt);
           min-width: 0;
         }
       </style></span></span><div class=\\"item  mock \\"><style>
diff --git a/components/select/select-option.tsx b/components/select/select-option.tsx
index 67d0824..abc8ddf 100644
--- a/components/select/select-option.tsx
+++ b/components/select/select-option.tsx
@@ -81,7 +81,7 @@ const SelectOption: React.FC<React.PropsWithChildren<SelectOptionProps>> = ({
         className={`option ${divider ? 'divider' : ''} ${label ? 'label' : ''} ${className}`}
         onClick={clickHandler}
         {...props}>
-        <Ellipsis>{children}</Ellipsis>
+        <Ellipsis height={`calc(1.688 * ${theme.layout.gap})`}>{children}</Ellipsis>
       </div>
 
       <style jsx>{`
diff --git a/components/select/select.tsx b/components/select/select.tsx
index 8f27829..b9e6306 100644
--- a/components/select/select.tsx
+++ b/components/select/select.tsx
@@ -139,7 +139,7 @@ const Select: React.FC<React.PropsWithChildren<SelectProps>> = ({
         {...props}>
         {isEmpty && (
           <span className="value placeholder">
-            <Ellipsis>{placeholder}</Ellipsis>
+            <Ellipsis height={sizes.height}>{placeholder}</Ellipsis>
           </span>
         )}
         {value && !multiple && <span className="value">{selectedChild}</span>}
diff --git a/components/shared/__tests__/__snapshots__/ellipsis.test.tsx.snap b/components/shared/__tests__/__snapshots__/ellipsis.test.tsx.snap
index 55de572..e29bb1d 100644
--- a/components/shared/__tests__/__snapshots__/ellipsis.test.tsx.snap
+++ b/components/shared/__tests__/__snapshots__/ellipsis.test.tsx.snap
@@ -6,6 +6,7 @@ exports[`Ellipsis should render correctly 1`] = `
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: 10px;
           min-width: 0;
         }
       </style></span></div>"
diff --git a/components/shared/__tests__/ellipsis.test.tsx b/components/shared/__tests__/ellipsis.test.tsx
index 9a064d6..293d68a 100644
--- a/components/shared/__tests__/ellipsis.test.tsx
+++ b/components/shared/__tests__/ellipsis.test.tsx
@@ -6,7 +6,7 @@ describe('Ellipsis', () => {
   it('should render correctly', () => {
     const wrapper = mount(
       <div style={{ width: '1px' }}>
-        <Ellipsis>text</Ellipsis>
+        <Ellipsis height="10px">text</Ellipsis>
       </div>,
     )
     expect(wrapper.html()).toMatchSnapshot()
diff --git a/components/shared/ellipsis.tsx b/components/shared/ellipsis.tsx
index 6a6f218..9ec8c1b 100644
--- a/components/shared/ellipsis.tsx
+++ b/components/shared/ellipsis.tsx
@@ -1,6 +1,10 @@
 import React from 'react'
 
-const Ellipsis: React.FC<React.PropsWithChildren<{}>> = ({ children }) => {
+export type EllipsisProps = {
+  height: string
+}
+
+const Ellipsis: React.FC<React.PropsWithChildren<EllipsisProps>> = ({ children, height }) => {
   return (
     <span>
       {children}
@@ -9,6 +13,7 @@ const Ellipsis: React.FC<React.PropsWithChildren<{}>> = ({ children }) => {
           overflow: hidden;
           text-overflow: ellipsis;
           white-space: nowrap;
+          line-height: ${height};
           min-width: 0;
         }
       `}</style>