design productivity Color System
Airtable's website is a clean, enterprise-friendly platform that communicates "sophisticated simplic...
Airtable's website is a clean, enterprise-friendly platform that communicates "s...
Airtable uses #181d26 as the primary accent for interactive elements
Carefully selected 8 colors for design-productivity applications
Clean, minimalist approach with purposeful color usage
#181d26
Primary text
#1b61c9
CTA buttons, links
#ffffff
Primary surface
rgba(249,252,255,0.97)
`--theme_button-text-spotlight`
#006400
`--theme_success-text`
rgba(4,14,32,0.69)
`--theme_text-weak`
rgba(7,12,20,0.82)
`--theme_button-text-secondary-active`
#333333
Secondary text
/* Airtable Color System */
:root {
--airtable-deep-navy: #181d26;
--airtable-airtable-blue: #1b61c9;
--airtable-white: #ffffff;
--airtable-spotlight: rgba(249,252,255,0.97);
--airtable-success-green: #006400;
--airtable-weak-text: rgba(4,14,32,0.69);
--airtable-secondary-active: rgba(7,12,20,0.82);
--airtable-dark-gray: #333333;
}
/* Example usage */
.airtable-button-primary {
background-color: var(--airtable-deep-navy);
color: #ffffff;
border: none;
border-radius: 8px;
padding: 8px 15px;
}Cal.com's website is a masterclass in monochromatic restraint — a grayscale worl...
Clay's website is a warm, playful celebration of color that treats B2B data enri...
Figma's interface is the design tool that designed itself — a masterclass in typ...
Framer's website is a cinematic, tool-obsessed dark canvas that radiates the con...