Obsidian tables have been upgraded in a big way. Obsidian now has a built-in table editor, which allows you to create and manage tables effortlessly.

If you’ve struggled with Obsidian tables before, then struggle no longer! To create a table, you can use the command palette or the right-click context menu. Then you can add, remove, or adjust tables with your mouse or keyboard shortcuts. See the official changelog for an example of the new table editor.

I’ve always used tables in Obsidian, but this new tool will make it much easier in the future.

Table of Contents

• Dataview and Obsidian Tables
• Obsidian Cards
• Themes in Obsidian
• Using Cards in Non Minimal Themes
• Installing CSS Snippets
• Conclusion

Dataview and Obsidian Tables

Plain tables are nice for some things, but I tend to prefer generating most of my tables with Dataview. Dataview will automatically keep your tables up-to-date, which means you won’t have to spend time managing them.

But there’s a problem: Dataview tables often have a lot of data in them. It can get overwhelming and start to look disorganized.

But I’ve found a solution, one that I like much better than default Obsidian tables. Let me introduce you to Obsidian Cards. Here’s a simple example:

Obsidian Cards

Cards are one of my favorite visual upgrades for Obsidian.

What are cards? They are a clever way of styling either tables or lists generated by Dataview.

Tables are great for tabular data, but many of us use tables for a lot more than that. We add notes, books, people, or even quotes in tables. And the more data you cram into a table, the less useful it is.

Cards make it easy. If you have a table, by default it looks like this:

With card styling, that table turns into this:

Pretty nice, eh?

I use a ton of Dataview queries in Obsidian. Cards were a huge upgrade for me, because they converted “messy” looking Dataview tables into a clean and elegant layout. Almost every Dataview query I create now uses the card styling, because it looks so much cleaner than default Obsidian tables.

There’s just one problem with cards: they aren’t supported by default in Obsidian. So how can we use them?

Themes in Obsidian

Let’s talk about themes. If you’re new to Obsidian, you might not realize this, but there are hundreds of high-quality (and free!) themes out there for Obsidian. If you go to Settings > Appearance in Obsidian, you can select and install any theme that looks interesting to you.

There are a ton of good ones out there, and I find that switching themes from time to time helps “freshen up” my vault. It makes me excited to explore again. Even though the content hasn’t changed, it changes my perception of the content in my vault.

Cards are, by default, a feature of one particular theme. I’ve written about using cards in this theme before, in my review of the Minimal theme. If you’re interested in learning more, see my full Minimal review.

If you use the Minimal theme, then using cards is easy. All you do is add the appropriate CSS Class to your note. In properties, you add “cssclasses” with a value of “card”.

Cards are one of my favorite features of this theme. So much so that I stopped changing themes for a while: I just used Minimal. 

But eventually I got tired of using the same theme. I missed some of the whimsy that you get from other themes. So I set out in search of a way to use Cards outside of the Minimal theme.

And I found a way! If you’re interested in using Cards but don’t want to use the Minimal theme, then keep reading.

Using Cards in Non Minimal Themes

You can use cards in any theme with the power of CSS Snippets. 

Obsidian themes are open-source, which means you find a read the code for any theme if you want to. I went and dug up the code for the Minimal theme, found the CSS responsible for Cards, and extracted it into a CSS snippet.

So without further ado, here’s proof that cards work in a bunch of different themes in Obsidian:

How can you add it to your vault? An excellent question.

Here’s a link to the code. Install this as a snippet in your vault, and you should be good to go. Not sure how? Follow the instructions below.

Installing CSS Snippets in Obsidian

If you’ve never used a CSS Snippet in Obsidian, then this is a good place to start!

To add a CSS Snippet, follow these instructions:

• Open your Obsidian Vault
• Go to Settings
• Under Appearance → CSS Snippets, click on the folder icon (“Open snippets folder”)
• This will open your system file manager. Create a file here using a text editor, and paste in the content of your snippet (you can find the cards snippet here)
• Save the file (I call it cards.css).
• Back in Obsidian, under Appearance → CSS Snippets, press the refresh icon (“Reload snippets”). Your new snippet should appear below, and you can enable it.

If you’ve successfully created a CSS file in the right folder, then your vault should now support cards.

To test it out, open a note with a table in it, and add cssclasses: cards to your properties.

Conclusion

If you struggle to use Obsidian tables because of how they look, then I hope you’ll give cards a try. This article should give you everything you need to get up and running, and to start improving your Obsidian tables and lists today.

If you have any questions or struggles, contact me privately or in the comments below, and I’ll get back to you.