System design fundamentalsIn reviewAndrews45Behavioral story bankReadyAndrews30Concurrency trade-offsPlanned—60
Caching trade-offsReadyQueue semanticsDraft
ElementsAndrewsAstroAndrews
Technical data
Use typography="body" for dense data and format="code" on columns containing identifiers.
copyablebooleanShow a copy button.copy-labelstringSet the copy button label.API reference: <cad-table>
captioncaptionstring''densitydensityCadTableDensity'regular'empty-textemptyTextstring'No data'min-widthminWidthstring'32rem'typographytypographyCadTableTypography'hand'variantvariantCadTableVariant'grid'zebrazebrabooleanfalsecaptionstringcaptionnodensityCadTableDensitydensityyesemptyTextstringempty-textnominWidthstringmin-widthnotypographyCadTableTypographytypographyyesvariantCadTableVariantvariantyeszebrabooleanzebrayes(default)`cad-table-column` and `cad-table-row` data.captionVisible table caption. Falls back to the `caption` attribute.baseResponsive scroll container.captionNative table caption.cellNative body cell.emptyEmpty-state cell.headerNative column header.tableNative table element.--cad-table-gridTable line color.--cad-table-inkTable foreground color.--cad-table-paperTable paper color.Accessibility
Provide a caption that names the data. Column keys connect cells to their headers. Wide tables scroll without changing the table structure. Focus the table to scroll with the arrow keys.