Table Cells Merge icon
Used to represent merging two cells in a table. The Table Cells Merge icon is part of Microsoft's Fluent UI System Icons, available here in filled and regular (outlined) styles on a 24 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Use the Table Cells Merge icon in React
Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.
npm install @fluentui/react-icons
import { TableCellsMerge24Regular, TableCellsMerge24Filled } from "@fluentui/react-icons";
export function Example() {
return <TableCellsMerge24Regular aria-label="Table Cells Merge" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_table_cells_merge_24_regular.svg" width="24" height="24" alt="Table Cells Merge"> Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.5799 11.25H8.42014L9.31056 10.2483C9.58575 9.93869 9.55786 9.46464 9.24827 9.18945C8.93869 8.91426 8.46463 8.94215 8.18944 9.25174L6.18944 11.5017C5.93685 11.7859 5.93685 12.2141 6.18944 12.4983L8.18944 14.7483C8.46463 15.0579 8.93869 15.0858 9.24827 14.8106C9.55786 14.5354 9.58575 14.0613 9.31056 13.7517L8.42013 12.75H15.5799L14.6895 13.7517C14.4143 14.0613 14.4422 14.5354 14.7517 14.8106C15.0613 15.0858 15.5354 15.0579 15.8106 14.7483L17.8106 12.4983L17.8211 12.4861C17.9264 12.3626 17.9923 12.2045 17.9994 12.0313C18.0002 12.0112 18.0002 11.991 17.9995 11.9709C17.9925 11.7899 17.9215 11.6254 17.8084 11.4993L15.8106 9.25174C15.5354 8.94215 15.0613 8.91426 14.7517 9.18945C14.4422 9.46464 14.4143 9.93869 14.6895 10.2483L15.5799 11.25ZM6.25 3C4.45507 3 3 4.45507 3 6.25V17.75C3 19.5449 4.45507 21 6.25 21H17.75C19.5449 21 21 19.5449 21 17.75V6.25C21 4.45507 19.5449 3 17.75 3H6.25ZM4.5 6.25C4.5 5.2835 5.2835 4.5 6.25 4.5H17.75C18.7165 4.5 19.5 5.2835 19.5 6.25V6.5H4.5V6.25ZM4.5 8H19.5V16H4.5V8ZM19.5 17.5V17.75C19.5 18.7165 18.7165 19.5 17.75 19.5H6.25C5.2835 19.5 4.5 18.7165 4.5 17.75V17.5H19.5Z" fill="currentColor"/></svg>Use it from the SVG package
Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:
npm install @fluentui/svg-icons
import icon from "@fluentui/svg-icons/icons/table_cells_merge_24_regular.svg";Details
| Name | Table Cells Merge |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_table_cells_merge_24_regular.svg |
| Filled file | ic_fluent_table_cells_merge_24_filled.svg |
| React components | TableCellsMerge24Regular, TableCellsMerge24Filled |
| License | MIT (© Microsoft Corporation) |