5d:I[333483,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/15s1ft4k9lx-7.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/1m75iqpnspynu.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/3ohf-5_4hfjuq.js","/creators-assets/_next/static/immutable/chunks/2jjhfe7-w6y9a.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/0kisxyo3aw231.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/0i7m0zg6jfazw.js","/creators-assets/_next/static/immutable/chunks/3-hmotkz_bdv_.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3naniu4pnqfyw.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/456d4lcv9-syj.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/2y9gv91n8o3i9.js","/creators-assets/_next/static/immutable/chunks/41i4r4u9uolgz.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/15q00pdqk0br3.js","/creators-assets/_next/static/immutable/chunks/293prjxu_wz0c.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3l2h8slpbzxqo.js","/creators-assets/_next/static/immutable/chunks/2xgtw4s-tlhet.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/1cphzzg2t2qo2.js"],"PostDetailCard"] 5e:T1042,

Overview

MultiBase Pro is a multi-view database component that lets users switch between four distinct layouts — Table, Gallery, Board (Kanban), and List — using one shared data source. It's built for real-world use cases: team directories, project trackers, CRM dashboards, inventory lists, and more.

Four Views, One Component

Table View Virtualized rows for blazing performance even with hundreds of records. Sortable columns, sticky header, zebra striping, row selection (single or multiple), and inline cell types: avatar, status badge, progress bar, currency, rating stars, date, link, image, and boolean.

Gallery View Responsive card grid with avatar, name, status badges, progress bars, and star ratings. Fully customizable: column count (1–6), card gap, radius, padding, and optional card shadows.

Board View (Kanban) Group items by any field — status, role, category, or custom. Each column shows a color-coded header with item count, and compact cards inside. Horizontal scroll for many groups.

List View Dense, Linear-style rows. Three density options: Comfortable, Compact, and Dense. Shows avatar, name, inline metadata, and status badge in a single scannable row.

View Switcher

A built-in toolbar toggle lets visitors switch views instantly. Smooth fade animation between views (can be disabled). Choose which views to enable and set the default.

Five Data Sources

Manual — Edit rows visually in the Framer property panel
Paste JSON — Drop in a JSON array
Paste CSV — Paste CSV text with headers
Remote JSON — Fetch from any public URL with optional auto-refresh
Remote CSV — Same for remote CSV endpoints

11 Cell Types

Text, Number, Currency, Date, Status (auto-colored badges), Progress (gradient bar), Avatar + Name, Rating (half-star support), Link (native Framer links), Image, and Boolean (checkbox).

Three Themes + Full Override

Choose from Slate (dark), Light, or Graphite. Enable Color Overrides to customize 18 individual tokens: panel, border, text, header, accent, success, warning, error, chip, and more.

12 Font Controls

Every text element has its own typography slot using Framer's native Font control: Headers, Cells, Name, Toolbar, Badges, Progress, Currency, Rating, Links, Dates, Buttons, and Small Text.

Complete Layout Control

Fine-tune every pixel: container radius, border width, row height, header height, cell padding, avatar size, badge radius, progress bar height, star size, image dimensions, search bar height, button size, checkbox size, and shadow toggle.

Features Toggle

Enable or disable individually: Search, Sorting, Selection (single/multiple), Sticky Header, Zebra Rows, Hover Highlight, Compact Mode, and Row Count display.

Export & Pagination

Export data as CSV, JSON, or copy to clipboard. Pagination with configurable page size (10–200) and page info display. Board view shows all items; Table, Gallery, and List views are paginated.

Property Controls Summary

View Settings — default view, enabled views, switcher, animation
Gallery Settings — columns, gap, card radius, padding, shadow
Board Settings — group-by field, column gap, column width, count badge
List Settings — density, dividers
Data Source — manual, JSON, CSV, remote JSON, remote CSV
Columns — key, label, type, width, currency, fallback image
Theme — Slate, Light, Graphite + 18 color overrides
Features — search, sort, select, sticky, zebra, hover, compact, count
Pagination — enable, page size, show info
Export — enable, format selection
Typography — 12 font slots
Layout — 25+ spacing and sizing tokens

5a:[["$","$L5d",null,{"post":{"id":"019c7088-9394-7bf9-b5ef-a9d25a7d6b2c","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"df3fedfd-4d3f-4100-b2f4-0eb9ffdcaaa1","name":"Can Girgin","slug":"can-girgin","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/29285/avatar-ET5yH7T79O6hzfpRHA4wHb7OxgIv8O.jpg","badges":["available","expert"],"followed":false,"followsYou":false},"media":[],"resources":[{"id":"tkLXnH9dDjzB9392faH0","resolved":true,"title":"MultiBase Pro","body":"$5e","bodyJson":null,"introduction":"Multi-view database with 4 smart layouts","slug":"multibase-pro","author":{"framerUserId":"df3fedfd-4d3f-4100-b2f4-0eb9ffdcaaa1","name":"Can Girgin","slug":"can-girgin","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/29285/avatar-ET5yH7T79O6hzfpRHA4wHb7OxgIv8O.jpg","badges":["available","expert"],"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/tkLXnH9dDjzB9392faH0/multibase-pro-bQBoOnurK1UKFUl5rQN6glb9joOfKt","metadata":{"tint":{"h":210,"s":22,"l":14},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-02-12T12:56:42.993Z","updatedAt":"2026-02-18T11:29:01.152Z","publishedAt":"2026-02-18T11:35:24.820Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://miraculous-support-422202.framer.app/","price":"15","paymentUrl":"https://joworks-studio.lemonsqueezy.com/checkout/buy/dd11d8b5-ccb8-41ef-8530-dc7bc2a656c3","workshop":false,"categories":[{"id":"cd81cc33-d6cf-4630-8e59-b5b3100166ba","name":"Buttons","slug":"buttons"}],"lastSaveId":"xqFdClaMo8oly0jPdhEA","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":0,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-02-18T11:35:24.820Z","updatedAt":"2026-02-18T11:35:24.820Z","reported":false}}],"$L5f"]

Suggested for you