diff --git a/lib/notion/notion.rb b/lib/notion/notion.rb
index 7cdd20d..774f7cc 100644
--- a/lib/notion/notion.rb
+++ b/lib/notion/notion.rb
@@ -322,6 +322,8 @@ def format_blocks(blocks)
         block_type = block["type"]
         block_data = block[block_type] || {}
 
+        next format_table_block(block, block_data) if block_type == "table"
+
         {
           type: block_type,
           text: extract_block_text(block_data, block),
@@ -333,6 +335,59 @@ def format_blocks(blocks)
       end
     end
 
+    def format_table_block(block, block_data)
+      table_data = fetch_table_data(block["id"])
+      rows = table_data[:rows].map do |row|
+        Array(row.dig("table_row", "cells")).map { |cell| extract_rich_text(cell) }
+      end
+
+      table_width = block_data["table_width"].to_i
+      table_width = rows.map(&:length).max.to_i if table_width.zero?
+
+      {
+        type: "table",
+        table_width: table_width,
+        has_column_header: block_data["has_column_header"] == true,
+        has_row_header: block_data["has_row_header"] == true,
+        has_more_rows: table_data[:has_more],
+        rows: normalize_table_rows(rows, table_width)
+      }
+    end
+
+    def fetch_table_data(table_id)
+      @table_data ||= {}
+      @table_data[table_id] ||= begin
+        response = api_client.get_page_blocks(table_id, page_size: 100)
+        results = response.is_a?(Hash) ? response["results"] : nil
+
+        {
+          rows: Array(results).select { |block| block.is_a?(Hash) && block["type"] == "table_row" },
+          has_more: response.is_a?(Hash) && response["has_more"] == true
+        }
+      rescue StandardError => e
+        Rails.logger.error "Notion table API error: #{e.message}"
+        { rows: [], has_more: false }
+      end
+    end
+
+    def normalize_table_rows(rows, table_width)
+      return [] if table_width.zero?
+
+      rows.map do |row|
+        normalized_row = row.first(table_width)
+        normalized_row.fill("", normalized_row.length...table_width)
+      end
+    end
+
+    def extract_rich_text(rich_text)
+      text = Array(rich_text).filter_map do |fragment|
+        next unless fragment.is_a?(Hash)
+
+        fragment["plain_text"] || fragment.dig("text", "content")
+      end.join
+      strip_emojis(text)
+    end
+
     def extract_block_text(block_data, block)
       caption = block_data.dig("caption", 0, "text", "content").presence
 
diff --git a/lib/notion/views/full.html.erb b/lib/notion/views/full.html.erb
index df5d98c..fc6125b 100644
--- a/lib/notion/views/full.html.erb
+++ b/lib/notion/views/full.html.erb
@@ -22,22 +22,30 @@
       <% end %>
     </div>
   <% elsif display_type == "page" %>
-    <div class="layout layout--top">
-      <% if items && items[:blocks] && items[:blocks].any? %>
-        <div class="columns" data-overflow-max-cols="<%= multi_column_display %>" data-overflow-counter="false">
-          <div class="column">
+    <% if items && items[:blocks] && items[:blocks].any? %>
+      <% has_table = items[:blocks].any? { |block| block[:type] == "table" && Array(block[:rows]).any? && block[:table_width].to_i.positive? } %>
+      <div class="layout layout--top<%= " notion-table-layout" if has_table %>">
+        <% if has_table %>
+          <div class="notion-table-columns">
+            <div class="notion-table-column">
+        <% else %>
+          <div class="columns" data-overflow-max-cols="<%= multi_column_display %>" data-overflow-counter="false">
+            <div class="column">
+        <% end %>
             <% items[:blocks].each_with_index do |block, idx| %>
               <%= render 'plugins/notion/shared/page_block', block: block, index: idx, current_layout: "full", image_height: image_height %>
             <% end %>
           </div>
         </div>
-      <% else %>
+      </div>
+    <% else %>
+      <div class="layout layout--top">
         <%= render 'plugins/notion/shared/error_section',
                    title_class: "title",
                    title_text: "No Content Available",
                    description_text: "Check your Notion configuration and try again" %>
-      <% end %>
-    </div>
+      </div>
+    <% end %>
   <% end %>
 
   <%= render partial: 'plugins/notion/shared/title_bar', locals: { instance_name: instance_name } %>
diff --git a/lib/notion/views/half_horizontal.html.erb b/lib/notion/views/half_horizontal.html.erb
index 8261644..e00c8e4 100644
--- a/lib/notion/views/half_horizontal.html.erb
+++ b/lib/notion/views/half_horizontal.html.erb
@@ -22,22 +22,30 @@
       <% end %>
     </div>
   <% elsif display_type == "page" %>
-    <div class="layout layout--top">
-      <% if items && items[:blocks] && items[:blocks].any? %>
-        <div class="columns" data-overflow-max-cols="<%= multi_column_display %>" data-overflow-counter="false">
-          <div class="column">
+    <% if items && items[:blocks] && items[:blocks].any? %>
+      <% has_table = items[:blocks].any? { |block| block[:type] == "table" && Array(block[:rows]).any? && block[:table_width].to_i.positive? } %>
+      <div class="layout layout--top<%= " notion-table-layout" if has_table %>">
+        <% if has_table %>
+          <div class="notion-table-columns">
+            <div class="notion-table-column">
+        <% else %>
+          <div class="columns" data-overflow-max-cols="<%= multi_column_display %>" data-overflow-counter="false">
+            <div class="column">
+        <% end %>
             <% items[:blocks].each_with_index do |block, idx| %>
               <%= render 'plugins/notion/shared/page_block', block: block, index: idx, current_layout: "half_horizontal", image_height: image_height %>
             <% end %>
           </div>
         </div>
-      <% else %>
+      </div>
+    <% else %>
+      <div class="layout layout--top">
         <%= render 'plugins/notion/shared/error_section',
                    title_class: "title title--small",
                    title_text: "No Content",
                    description_text: "Check your Notion configuration" %>
-      <% end %>
-    </div>
+      </div>
+    <% end %>
   <% end %>
 
   <%= render partial: 'plugins/notion/shared/title_bar', locals: { instance_name: instance_name } %>
diff --git a/lib/notion/views/half_vertical.html.erb b/lib/notion/views/half_vertical.html.erb
index 0dbdbbe..41f06d4 100644
--- a/lib/notion/views/half_vertical.html.erb
+++ b/lib/notion/views/half_vertical.html.erb
@@ -21,23 +21,31 @@
                    description_text: "Check your Notion configuration" %>
       <% end %>
     </div>
-<% elsif display_type == "page" %>
-    <div class="layout layout--top">
-      <% if items && items[:blocks] && items[:blocks].any? %>
-        <div class="columns" data-overflow-max-cols="1" data-overflow-counter="false">
-          <div class="column">
+  <% elsif display_type == "page" %>
+    <% if items && items[:blocks] && items[:blocks].any? %>
+      <% has_table = items[:blocks].any? { |block| block[:type] == "table" && Array(block[:rows]).any? && block[:table_width].to_i.positive? } %>
+      <div class="layout layout--top<%= " notion-table-layout" if has_table %>">
+        <% if has_table %>
+          <div class="notion-table-columns">
+            <div class="notion-table-column">
+        <% else %>
+          <div class="columns" data-overflow-max-cols="1" data-overflow-counter="false">
+            <div class="column">
+        <% end %>
             <% items[:blocks].each_with_index do |block, idx| %>
               <%= render 'plugins/notion/shared/page_block', block: block, index: idx, current_layout: "half_vertical", image_height: image_height %>
             <% end %>
           </div>
         </div>
-      <% else %>
+      </div>
+    <% else %>
+      <div class="layout layout--top">
         <%= render 'plugins/notion/shared/error_section',
                    title_class: "title title--small",
                    title_text: "No Content",
                    description_text: "Check your Notion configuration" %>
-      <% end %>
-    </div>
+      </div>
+    <% end %>
   <% end %>
 
   <%= render partial: 'plugins/notion/shared/title_bar', locals: { instance_name: instance_name } %>
diff --git a/lib/notion/views/quadrant.html.erb b/lib/notion/views/quadrant.html.erb
index 577621c..3bbc557 100644
--- a/lib/notion/views/quadrant.html.erb
+++ b/lib/notion/views/quadrant.html.erb
@@ -22,22 +22,30 @@
       <% end %>
     </div>
   <% elsif display_type == "page" %>
-    <div class="layout layout--top">
-      <% if items && items[:blocks] && items[:blocks].any? %>
-        <div class="columns" data-overflow-max-cols="1" data-overflow-counter="false">
-          <div class="column">
+    <% if items && items[:blocks] && items[:blocks].any? %>
+      <% has_table = items[:blocks].any? { |block| block[:type] == "table" && Array(block[:rows]).any? && block[:table_width].to_i.positive? } %>
+      <div class="layout layout--top<%= " notion-table-layout" if has_table %>">
+        <% if has_table %>
+          <div class="notion-table-columns">
+            <div class="notion-table-column">
+        <% else %>
+          <div class="columns" data-overflow-max-cols="1" data-overflow-counter="false">
+            <div class="column">
+        <% end %>
             <% items[:blocks].each_with_index do |block, idx| %>
               <%= render 'plugins/notion/shared/page_block', block: block, index: idx, current_layout: "quadrant", image_height: image_height %>
             <% end %>
           </div>
         </div>
-      <% else %>
+      </div>
+    <% else %>
+      <div class="layout layout--top">
         <%= render 'plugins/notion/shared/error_section',
                    title_class: "title title--small",
                    title_text: "No Content",
                    description_text: "Check config" %>
-      <% end %>
-    </div>
+      </div>
+    <% end %>
   <% end %>
 
   <%= render partial: 'plugins/notion/shared/title_bar', locals: { instance_name: instance_name } %>
diff --git a/lib/notion/views/shared/_page_block.html.erb b/lib/notion/views/shared/_page_block.html.erb
index ed4df8c..899f915 100644
--- a/lib/notion/views/shared/_page_block.html.erb
+++ b/lib/notion/views/shared/_page_block.html.erb
@@ -1,6 +1,8 @@
 <% if block[:type] == "divider" %>
   <div style="border-top: 1px dotted #000000;"></div>
-<% elsif ["table_of_contents", "table", "unsupported", "synced_block", "breadcrumb", "column_list"].include?(block[:type]) %>
+<% elsif block[:type] == "table" %>
+  <%= render 'plugins/notion/shared/table', table: block, current_layout: current_layout %>
+<% elsif ["table_of_contents", "unsupported", "synced_block", "breadcrumb", "column_list"].include?(block[:type]) %>
   <% return %>
 <% else %>
   <div class="item">
diff --git a/lib/notion/views/shared/_table.html.erb b/lib/notion/views/shared/_table.html.erb
new file mode 100644
index 0000000..b8e6396
--- /dev/null
+++ b/lib/notion/views/shared/_table.html.erb
@@ -0,0 +1,204 @@
+<%
+  layout_limits = {
+    "full" => { rows: 12, columns: 8, lines: 3 },
+    "half_horizontal" => { rows: 6, columns: 8, lines: 2 },
+    "half_vertical" => { rows: 10, columns: 4, lines: 3 },
+    "quadrant" => { rows: 6, columns: 4, lines: 2 }
+  }
+  limits = layout_limits.fetch(current_layout, layout_limits["full"])
+
+  source_rows = Array(table[:rows]).map { |row| Array(row) }
+  source_column_count = table[:table_width].to_i
+  source_column_count = source_rows.map(&:length).max.to_i if source_column_count.zero?
+
+  hidden_column_count = source_column_count > limits[:columns] ? source_column_count - limits[:columns] + 1 : 0
+  visible_source_columns = hidden_column_count.positive? ? limits[:columns] - 1 : source_column_count
+  displayed_column_count = [source_column_count, limits[:columns]].min
+
+  row_results_truncated = table[:has_more_rows] == true
+  needs_row_summary = source_rows.length > limits[:rows] || row_results_truncated
+  visible_source_rows = needs_row_summary ? [limits[:rows] - 1, source_rows.length].min : source_rows.length
+  hidden_row_count = source_rows.length - visible_source_rows
+  hidden_row_label = row_results_truncated ? "+#{[hidden_row_count, 1].max}+ rows" : "+#{hidden_row_count} rows"
+
+  rows = source_rows.first(visible_source_rows).map.with_index do |row, row_index|
+    cells = row.first(visible_source_columns)
+    cells.fill("", cells.length...visible_source_columns)
+    cells << (row_index.zero? ? "+#{hidden_column_count} cols" : "…") if hidden_column_count.positive?
+    cells
+  end
+
+  if needs_row_summary
+    summary_row = Array.new(displayed_column_count, "…")
+    summary_row[0] = hidden_row_label
+    rows << summary_row
+  end
+
+  dense = rows.length > 8 || displayed_column_count > 6
+  line_limit = dense ? [limits[:lines], 2].min : limits[:lines]
+  line_limit = 1 if %w[half_horizontal quadrant].include?(current_layout) && rows.length == limits[:rows]
+%>
+
+<% if rows.any? && displayed_column_count.positive? %>
+  <style>
+    .notion-table-layout {
+      min-height: 0;
+    }
+
+    .notion-table-layout > .notion-table-columns,
+    .notion-table-layout > .notion-table-columns > .notion-table-column {
+      height: 100%;
+      min-height: 0;
+    }
+
+    .notion-table-columns {
+      width: 100%;
+      overflow: hidden;
+    }
+
+    .notion-table-column {
+      display: flex;
+      flex-direction: column;
+      gap: var(--gap);
+    }
+
+    .notion-table-frame {
+      width: 100%;
+      min-height: 0;
+      overflow: hidden;
+    }
+
+    .notion-table-layout .notion-table-frame {
+      flex: 1 1 0;
+    }
+
+    .notion-table {
+      display: grid;
+      grid-template-columns: repeat(var(--notion-table-columns), minmax(0, 1fr));
+      grid-template-rows: repeat(var(--notion-table-rows), minmax(0, 1fr));
+      width: 100%;
+      height: 100%;
+      min-height: 0;
+      overflow: hidden;
+      border-top: 1px solid var(--framework-border-strong, #000);
+      border-left: 1px solid var(--framework-border-strong, #000);
+      box-sizing: border-box;
+      color: var(--framework-text-primary, #000);
+    }
+
+    .notion-table.notion-table > thead,
+    .notion-table.notion-table > tbody,
+    .notion-table.notion-table tr {
+      display: contents;
+    }
+
+    .notion-table th,
+    .notion-table td {
+      --notion-cell-pad-block: calc(3px * var(--content-scale, 1));
+      --notion-cell-pad-inline: calc(5px * var(--content-scale, 1));
+      --notion-cell-font: calc(14px * var(--text-ui-scale, 1));
+      --notion-cell-leading: 1.1;
+      display: flex;
+      align-items: center;
+      min-width: 0;
+      min-height: 0;
+      overflow: hidden;
+      padding: var(--notion-cell-pad-block) var(--notion-cell-pad-inline);
+      border-right: 1px solid var(--framework-border-strong, #000);
+      border-bottom: 1px solid var(--framework-border-strong, #000);
+      box-sizing: border-box;
+      font-size: var(--notion-cell-font);
+      font-weight: 400;
+      line-height: var(--notion-cell-leading);
+      overflow-wrap: anywhere;
+      white-space: pre-wrap;
+    }
+
+    .notion-table .notion-table__cell--header,
+    .notion-table .notion-table__cell--summary {
+      background-color: var(--framework-fill-soft, #e5e5e5);
+      font-weight: 700;
+    }
+
+    .notion-table .notion-table__cell--important {
+      background-color: var(--framework-slot-chip-bg-color, var(--framework-fill-strong, #000));
+      background-image: var(--framework-slot-chip-bg-image, none);
+      color: var(--framework-slot-chip-text-color, var(--framework-text-inverse, #fff));
+      -webkit-text-fill-color: currentColor;
+      font-weight: 700;
+    }
+
+    .notion-table__text {
+      display: block;
+      width: 100%;
+      min-width: 0;
+      overflow: hidden;
+    }
+
+    .notion-table__text[data-clamp="1"] {
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .notion-table--dense th,
+    .notion-table--dense td {
+      --notion-cell-pad-block: calc(2px * var(--content-scale, 1));
+      --notion-cell-pad-inline: calc(4px * var(--content-scale, 1));
+      --notion-cell-font: calc(12px * var(--text-ui-scale, 1));
+      --notion-cell-leading: 1.05;
+    }
+
+    .notion-table--half_horizontal th,
+    .notion-table--half_horizontal td {
+      --notion-cell-pad-block: calc(2px * var(--content-scale, 1));
+      --notion-cell-pad-inline: calc(4px * var(--content-scale, 1));
+      --notion-cell-font: calc(11px * var(--text-ui-scale, 1));
+      --notion-cell-leading: 1.1;
+    }
+
+    .notion-table--half_vertical th,
+    .notion-table--half_vertical td {
+      --notion-cell-pad-block: calc(3px * var(--content-scale, 1));
+      --notion-cell-pad-inline: calc(3px * var(--content-scale, 1));
+      --notion-cell-font: calc(11px * var(--text-ui-scale, 1));
+      --notion-cell-leading: 1.1;
+    }
+
+    .notion-table--quadrant th,
+    .notion-table--quadrant td {
+      --notion-cell-pad-block: calc(2px * var(--content-scale, 1));
+      --notion-cell-pad-inline: calc(2px * var(--content-scale, 1));
+      --notion-cell-font: calc(10px * var(--text-ui-scale, 1));
+      --notion-cell-leading: 1.05;
+    }
+  </style>
+
+  <% has_column_header = table[:has_column_header] && visible_source_rows.positive? %>
+  <div class="notion-table-frame">
+    <table class="table notion-table notion-table--<%= current_layout %><%= " notion-table--dense" if dense %>"
+           aria-rowcount="<%= source_rows.length %>"
+           aria-colcount="<%= source_column_count %>"
+           style="--notion-table-columns: <%= displayed_column_count %>; --notion-table-rows: <%= rows.length %>;">
+      <% rows.each_with_index do |row, row_index| %>
+        <% if has_column_header && row_index.zero? %><thead><% elsif row_index == (has_column_header ? 1 : 0) %><tbody><% end %>
+        <tr>
+          <% row.each_with_index do |cell, column_index| %>
+            <% summary = (needs_row_summary && row_index == rows.length - 1) || (hidden_column_count.positive? && column_index == row.length - 1) %>
+            <% header = (has_column_header && row_index.zero?) || (table[:has_row_header] && column_index.zero?) %>
+            <% important = !summary && cell.to_s.lines.any? { |line| line.lstrip.start_with?("!") } %>
+            <% cell_classes = ["notion-table__cell"] %>
+            <% cell_classes << "notion-table__cell--header" if header %>
+            <% cell_classes << "notion-table__cell--summary" if summary %>
+            <% cell_classes << "notion-table__cell--important" if important %>
+            <% tag_name = header ? "th" : "td" %>
+            <<%= tag_name %> class="<%= cell_classes.join(" ") %>"<% if header %> scope="<%= has_column_header && row_index.zero? ? "col" : "row" %>"<% end %>>
+              <span class="notion-table__text" data-clamp="<%= line_limit %>" data-pixel-perfect="true"><%= cell %></span>
+            </<%= tag_name %>>
+          <% end %>
+        </tr>
+        <% if has_column_header && row_index.zero? %></thead><% end %>
+      <% end %>
+      <% if rows.length > (has_column_header ? 1 : 0) %></tbody><% end %>
+    </table>
+  </div>
+<% end %>