Glossary

Designers, developers and business teams use these words the same way, so a spec, a ticket and the code all mean the same thing.

A–C

• Attribute. A setting written in HTML, such as variant="secondary". Most properties can also be set as attributes.
• Base token. A raw value, such as a palette color or a step in the spacing scale. Semantic tokens point to them. See Working with tokens.
• Brand theme. The set of token values that makes Neighborhood look like one brand: its colors, fonts, spacing and small details. Each page loads one. See Brand theming.
• Breakpoint. A screen width where layouts change, from XS (375px) to XXL (1300px). See Breakpoints.
• Button. An action that happens on the same page, such as submitting a form or opening a dialog. Compare CTA and Link.
• Changelog. The list of changes in each release. See the changelog.
• Component. A finished building block, such as Button, Card or Hero Split. Each is a Web Component, with a React version.
• Component token. A custom property for one component, such as --nbhd-card-borderRadius. Set it to change that component. See Styling.
• Container. The component that keeps content to the brand’s maximum width and adds space at the sides. See Layout and responsive.
• Content model. The content (slots) and settings (properties) of each component, and how they map to a CMS. See Content model.
• Context color. A color token, such as --nbhd-context-color-text-primary, that changes with the surface it sits on, so text stays readable. See Surfaces and color.
• CSS part. A named element inside a component that your CSS can style with ::part(). See Styling.
• CTA (call to action). A link styled as a button that takes the visitor to another page or section, such as “Shop faucets”. See Content and media.

D–L

• Deprecated. A component that still works but will be removed in a future major release. Avoid it in new work. See Component Status.
• Draft. A component or brand theme that’s built and documented but can still change before it’s Ready.
• Event. A message a component sends when something happens, such as nbhd-page-changed. All start with nbhd-.
• Eyebrow. A short label above a title, such as a category or “New”.
• Flex. The component that places its children in a row or column. See Layout and responsive.
• Foundations. The shared scales every component uses: color, type, spacing, borders, shadows and more. See Foundations.
• Headline Content. A section with an eyebrow, title, copy and call to action, without media.
• Hero Split. A section with media on one side and content on the other.
• Humongotron, Jumbotron and Minitron. Feature sections with an image or video and content over or beside it. Humongotron is the largest, with an optional scroll indicator; Jumbotron is the main hero; Minitron is a smaller version of Jumbotron.
• Link. A link inside text or a list, such as a product name in a sentence. Compare CTA.

M–R

• Major version. A release that can include breaking changes, such as v5. Docs for earlier major versions are on the Versions page.
• MCP server. The service that gives AI assistants live access to Neighborhood’s components. See AI tools (MCP).
• Neighborhood CSS. Tailwind CSS utilities built from the tokens, for your own markup. See Neighborhood CSS.
• Playground. The frame around a component in Storybook that shows it on a surface. It isn’t part of the component. See Storybook.
• Property. A setting on a component, such as variant or surface. In React, a prop. Each component page lists them under Properties.
• Ready. A component or brand theme that’s stable and supported for production.
• Release. A new version of the Neighborhood packages. Each site updates on its own schedule.

S–Z

• Semantic token. A token named for its purpose, such as --nbhd-color-text-primary or --nbhd-space-4. Use these in your own CSS and specs. See Working with tokens.
• Shadow DOM. The private part of a component that holds its own markup and styles, so page CSS can’t break it. See Styling.
• Slot. A named place in a component for your content, such as title or cta. You fill it with the slot attribute. See Content model.
• Storybook. The live, interactive catalog of every component, on any brand. See Storybook.
• Subtitle. A second line under a title that adds context.
• Surface. The background a section sits on, with the text and link colors that go with it: primary, secondary, inverse, inverse-secondary or none. See Surfaces and color.
• Token. A named value for color, type, spacing or another style, such as --nbhd-space-4. Brand themes give tokens their values. See Working with tokens.
• Unbranded. The tokens without a brand theme, for internal tools and other work without a brand.
• Variant. One of a component’s styles, such as a primary or secondary button.
• Web Component. A custom HTML element, such as <nbhd-button>, that works in plain HTML, any framework and CMS templates.