diff --git a/querybook/webapp/components/DataDocStatementExecution/StatementResult.tsx b/querybook/webapp/components/DataDocStatementExecution/StatementResult.tsx
index 96fe1a913..7ce97cca7 100644
--- a/querybook/webapp/components/DataDocStatementExecution/StatementResult.tsx
+++ b/querybook/webapp/components/DataDocStatementExecution/StatementResult.tsx
@@ -12,6 +12,7 @@ import { useImmer } from 'hooks/useImmer';
 import { useToggleState } from 'hooks/useToggleState';
 import { getSelectStatementLimit } from 'lib/sql-helper/sql-limiter';
 import { formatNumber } from 'lib/utils/number';
+import { stopPropagation } from 'lib/utils/noop';
 import { IStoreState } from 'redux/store/types';
 import { TextButton } from 'ui/Button/Button';
 import { InfoButton } from 'ui/Button/InfoButton';
@@ -21,6 +22,7 @@ import { Loading } from 'ui/Loading/Loading';
 import { Message } from 'ui/Message/Message';
 import { Popover } from 'ui/Popover/Popover';
 import { PrettyNumber } from 'ui/PrettyNumber/PrettyNumber';
+import { SearchBar } from 'ui/SearchBar/SearchBar';
 import { IOptions, makeSelectOptions, Select } from 'ui/Select/Select';
 import { ShowMoreText } from 'ui/ShowMoreText/ShowMoreText';
 import { AccentText } from 'ui/StyledText/StyledText';
@@ -397,6 +399,14 @@ const ColumnToggleMenuButton: React.FC<{
 }> = ({ columnNames, columnVisibility, toggleVisibility }) => {
     const buttonRef = React.useRef<HTMLAnchorElement>();
     const [showPopover, _, toggleShowPopover] = useToggleState(false);
+    const [keyword, setKeyword] = useState('');
+    const filteredColumnNames = useMemo(
+        () =>
+            columnNames.filter((names) =>
+                names.toLowerCase().includes(keyword.toLowerCase())
+            ),
+        [columnNames, keyword]
+    );
     const isAllSelected = useMemo(
         () => columnNames.every((columnName) => columnVisibility[columnName]),
         [columnNames, columnVisibility]
@@ -404,22 +414,37 @@ const ColumnToggleMenuButton: React.FC<{
 
     const getPopoverContent = () => (
         <div className="StatementResult-column-toggle-menu">
+            <div onClick={stopPropagation}>
+                <SearchBar
+                    value={keyword}
+                    onSearch={setKeyword}
+                    placeholder="Search"
+                    transparent
+                    delayMethod="throttle"
+                    hasClearSearch={true}
+                />
+            </div>
             <div key="all">
                 <Checkbox
-                    title={isAllSelected ? 'Hide All' : 'Select All'}
+                    title={
+                        (isAllSelected ? 'Hide All' : 'Select All') +
+                        (keyword === '' ? '' : ' Visible')
+                    }
                     value={isAllSelected}
                     onChange={() => {
                         if (isAllSelected) {
-                            columnNames.map((col) => toggleVisibility(col));
+                            filteredColumnNames.map((col) =>
+                                toggleVisibility(col)
+                            );
                         } else {
-                            columnNames
+                            filteredColumnNames
                                 .filter((col) => !columnVisibility[col])
                                 .map((column) => toggleVisibility(column));
                         }
                     }}
                 />
             </div>
-            {columnNames.map((columnName) => (
+            {filteredColumnNames.map((columnName) => (
                 <div key={columnName}>
                     <Checkbox
                         title={columnName}
diff --git a/querybook/webapp/ui/SearchBar/SearchBar.scss b/querybook/webapp/ui/SearchBar/SearchBar.scss
index f28dea6cd..283c6b0f9 100644
--- a/querybook/webapp/ui/SearchBar/SearchBar.scss
+++ b/querybook/webapp/ui/SearchBar/SearchBar.scss
@@ -24,4 +24,16 @@
         border-left: var(--border);
         height: 20px;
     }
+
+    &.clear-search {
+        .DebouncedInput {
+            flex: 9;
+        }
+        .SearchIcon {
+            flex: 1;
+        }
+        .Button{
+            flex: 1;
+        }
+    }
 }
diff --git a/querybook/webapp/ui/SearchBar/SearchBar.tsx b/querybook/webapp/ui/SearchBar/SearchBar.tsx
index 1897b7cd1..986d748da 100644
--- a/querybook/webapp/ui/SearchBar/SearchBar.tsx
+++ b/querybook/webapp/ui/SearchBar/SearchBar.tsx
@@ -74,6 +74,7 @@ export const SearchBar: React.FunctionComponent<ISearchBarProps> = ({
         SearchBar: true,
         [className]: Boolean(className),
         transparent,
+        'clear-search': hasClearSearch,
     });
 
     const clearSearchButton =