diff --git a/components/data-display.html b/components/data-display.html
index cccc309..cec3d9e 100644
--- a/components/data-display.html
+++ b/components/data-display.html
@@ -334,11 +334,19 @@
           return compareValues(leftValue, rightValue, state.direction);
         });
 
+        let visibleIndex = 0;
         sortedRows.forEach((row) => {
           table.appendChild(row);
           const isVisible = rowMatchesQuery(row, state.query);
           row.classList.toggle('sg-large-table__row--hidden', !isVisible);
           row.setAttribute('aria-hidden', isVisible ? 'false' : 'true');
+          row.classList.remove('sg-large-table__row--striped-light');
+          if (isVisible && visibleIndex % 2 === 0) {
+            row.classList.add('sg-large-table__row--striped-light');
+          }
+          if (isVisible) {
+            visibleIndex += 1;
+          }
         });
 
         if (loadMoreRow) {
diff --git a/styles/42-components-data-display.css b/styles/42-components-data-display.css
index 87fc898..5bb263e 100644
--- a/styles/42-components-data-display.css
+++ b/styles/42-components-data-display.css
@@ -97,7 +97,7 @@
   background: var(--color-medium-grey);
 }
 
-.sg-large-table > .sg-large-table__row:nth-child(odd) {
+.sg-large-table__row--striped-light {
   background: var(--color-light-grey);
 }