Simple request: Can you please incorporate the ability to create colored and/or highlighted fields? I’d like to call out certain rows within sheets. With the inferior, last generation sheets programs (shameless sucking up) I’d always used colors for this purpose. I realize I could use a column for this, but its a waste of a column in my mind, especially if you are trying to avoid scrolling left to right.
+1 for coloring. I’m sharing a grid view and want to call out the new column that I just added with the notes from the meeting for each each of the items.
While I agree with other users that I could use the abilities to color code to indicate a tag or conditional parameter, I’d also like the ability to black out a cell to indicate that the cell is intentionally empty (as opposed to the information just being missing) - particularly for multi-select or single-select columns.
If you don’t mind the colour implementation occasionally breaking due to code updates in the AirTable HTML, you can use something like Stylish/Stylus to apply a custom CSS to your tables.
For example, this is what I use to colour linked and calculated fields (to show that they can’t be manually edited):
div.cell[data-columntype~=“lookup”],
div.cell[data-columntype~=“count”],
div.cell[data-columntype~=“rollup”] {
background-color: aliceblue;
}
div.cell[data-columntype~=“formula”] {
background-color: ivory;
}
You can also use div.cell[data-columnid="(column id)"] to target a specific field.
If you want to highlight particular records, you’ll need to use something that’ll run custom JS, like Greasemonkey/Tampermonkey. Since it’s a bit more involved and has the potential to cause problems with site function, I won’t go into depth on the topic.
To give you an idea of what that looks like, here are two screenshots from my own base:
This is a grid view of our publication calendar. The first field {Full Title} is a formula field so it’s coloured “ivory” by default, but record #1 is blue because I’ve parsed the content using Tampermonkey and set a custom attribute on the cell, which then gets picked up by the CSS. The third column is coloured “aliceblue” because it’s a lookup field. The coloured bar at the start of each row is based on the last three fields in the screenshot: {Site}, {Story}, {Photos}. The green and purple columns are part of AirTable’s filter and grouping functions, not part of the custom CSS.
This is a calendar view of the same data as the grid. Items that are “completed” are coloured blue. The coloured bars are again based on {Site}, {Story}, {Photos}.* Holidays are displayed without borders and have a pink background and negative margins (to overflow the regular cell position). There are a few other tweaks as well, such as hiding the sidebar, or displaying the full entry content on hover (see July 5).
Note that this is very much a hack and any changes to the AirTable backend will probably break the code. (The calendar view code, for example, was significantly altered sometime in June, IIRC. It used to be coded as a table with each calendar entry nesting logically within each day, and each day nesting within a week (so you could easily do things like shrink or hide the weekends). Now the entries “float” over top of the calendar grid, so when you resize a particular “day” column, it has no effect on the entries that supposedly fall within it. One interesting side effect is that you can easily hack entries to span multiple days, just by changing their width, which is set in fixed percentages. I haven’t done so here, since I’m too lazy to figure out how to handle overlaps and spanning across weeks.)
*Note that you can’t actually access those fields from the calendar view unless they’re displayed. One workaround is to pass the information onto the {Full Title} primary field by tacking on a “code” to the end to indicate the state of those three fields (I used Unicode superscript numbers because we never use them in story titles). Then use Greasemonkey to parse the “code” and inject the appropriate divs and attributes, and then delete the “code” from the div content.
I’m in the “wanting to use color to tag a record” group. I have a table of fifty people, divided into different color groups. Right now I have a multiple select field where I select the color group they are in, but I agree with other users that is is a waste of a column (even though I’ve hidden it) when it would be easier (and more visually appealing) to be able to color an entire record. Sorting by color would also be helpful, so I could keep the group members together.
Update from the Airtable team: We are excited to announce a beta of conditional record coloring! You can specify different record coloring rules for each view in a table. Each record’s color can be based on either the color of a single select field, or conditions that work like filters.
At this time we are opening up the beta to customers on our pro plans and higher. If you are on a pro plan and are interested in being added to the record coloring beta, sign up here. Please allow us up to a week to process signups from this form.
Since you already have the multiple select field, you can group and sort by that multiple select field (the sort order is determined by the order of entries when you go to “Customize field type”). Note that if anyone is assigned two or more colours (which you can do with multiple select), they will appear in their own “group” and will not appear in any of the individual groups they’ve been assigned to. (Say Bob is both “Blue” and “Red”, he would appear in a group “Blue & Red”, and would be absent from “Blue” and “Red” separately.)
