Barbershop

CSS Styling Manual

Universal - * tag - div (example)

ID - #header-btn (can only be used once on the page)

Class - .header-btn (using a dot)

Attribute - [type], [type="button"]

Child - .header-list > .header-link (first nesting using the equal sign)

Descendant - .header-list a (for all descendants using a space)

Utility classes (for example, one class for resetting link decorations and margins with paddings)

Attribute for links against phishing rel="noopener noreferrer nofollow"

Font Fascia

Plugin to see all font styles used in a layout in Figma at once.