whatisgithub

What is css?

airbnb/css — explained in plain English

Analysis updated 2026-06-24

6,977Audience · developerComplexity · 1/5Setup · easy

In one sentence

Airbnb's archived internal style guide for writing CSS and Sass, covering formatting rules, BEM naming conventions, and best practices that helped their team keep stylesheets readable and maintainable as the codebase grew.

Mindmap

mindmap
  root((airbnb css))
    What it does
      CSS and Sass style guide
      Team coding standards
      Archived reference
    Key rules
      BEM naming convention
      No ID selectors
      Sass nesting limits
    BEM explained
      Block component
      Element child
      Modifier variant
    Audience
      Frontend developers
      Design system teams
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Use the BEM naming guide to standardize CSS class names across your team's component library

USE CASE 2

Review Airbnb's Sass ordering and nesting rules to establish code review standards for your project

USE CASE 3

Fork this guide and adapt it as your own team's internal CSS coding standard reference

What is it built with?

CSSSass

How does it compare?

airbnb/cssaheckmann/gmalibaba/andfix
Stars6,9776,9786,978
LanguageJavaScriptC++
Setup difficultyeasymoderatemoderate
Complexity1/52/53/5
Audiencedeveloperdeveloperdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · easy Time to first run · 5min

So what is it?

This repository contains Airbnb's internal style guide for writing CSS and Sass, the two most common languages used to control how web pages look. CSS is the standard language for describing visual styles, and Sass is an extension that adds features like variables and reusable snippets. The guide documents the formatting rules and naming conventions that Airbnb's engineering team agreed to follow when writing stylesheets. The guide covers basics like how to indent code, when to add spaces, and how to write comments. It also covers more opinionated choices, such as avoiding ID selectors in CSS because they can be difficult to override, and keeping JavaScript-related class names separate from visual styling class names to prevent the two concerns from getting tangled together. A significant portion of the guide explains BEM, a naming convention that stands for Block, Element, Modifier. The idea is to give CSS class names a structured format that makes it clear which parts of a component a style targets and how variations are named. For example, a card component might have a class for the card itself, a class for its title, and a class for a featured variant, each named in a predictable pattern. This approach helps teams maintain consistent, readable stylesheets as a codebase grows. For Sass specifically, the guide recommends using the .scss file format, ordering property declarations before any included mixins, and placing nested selectors at the end. It advises against deep nesting because that makes styles harder to override and read. Note that Airbnb has archived this repository. They no longer maintain it because they stopped using this technology internally. The content remains available for reference, and anyone interested can fork it to continue development.

Copy-paste prompts

Prompt 1
Based on Airbnb's CSS style guide, show me how to name classes for a card component with a title element and a featured variant using BEM, give me examples for the block, element, and modifier patterns.
Prompt 2
What does Airbnb's CSS guide say about using ID selectors, and why should they be avoided? Apply those rules to refactor this CSS: #header { color: red, }
Prompt 3
Show me the recommended order for property declarations, mixin includes, and nested selectors inside a Sass component file, following Airbnb's .scss conventions.
Prompt 4
Airbnb's guide recommends separating JavaScript class names from visual styling class names. Show me an example of how to structure a button component's HTML and CSS to follow this rule.

Frequently asked questions

What is css?

Airbnb's archived internal style guide for writing CSS and Sass, covering formatting rules, BEM naming conventions, and best practices that helped their team keep stylesheets readable and maintainable as the codebase grew.

How hard is css to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is css for?

Mainly developer.

Open on GitHub → Ask about another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.