# Mangrove editorial manual > Mechanical style rules (capitalization, punctuation, numbers and dates, abbreviations, italics, spelling), UNDRR-specific terminology, plus disability inclusive and gender-inclusive language for UNDRR Mangrove UI copy, component docs and Storybook pages. Each rule is credited to its source: the UNDRR Publications SOP, the UN Geneva Web Style Guide, the United Nations Editorial Manual, the United Nations Disability-Inclusive Communications Guidelines or the DPI Gender Checklist for Content Creators; see the "Keeping this updated" section below for the full source list and priority order. This guide covers mechanical style rules (capitalization, punctuation, numbers and dates, abbreviations, italics, spelling, UNDRR-specific terminology, disability inclusive language and gender-inclusive language) for UI copy, component docs, Storybook pages, developer docs and changelogs. It is derived from, and credits, five sources, each fetched and checked against this doc on **23 September 2026**. See [Keeping this updated](#keeping-this-updated) for when to re-check. - **UNDRR Publications SOP** (internal, UNDRR Communications team; `SOP_Publication-2026.docx`, fetched 23 September 2026): the house style UNDRR uses for its own publications. Authoritative for anything UNDRR-specific: named entities (Sendai Framework targets/priorities/indicators, GAR, campaigns), terminology conventions and gender language choices. Not publicly linkable (UNDRR SharePoint); contact the Communications team for the current version. - [UN Geneva Web Style Guide](https://www.ungeneva.org/en/styleguide) (fetched 23 September 2026): written for web content; the primary reference for general web/UI mechanics not covered by the SOP. - [United Nations Editorial Manual](https://www.un.org/dgacm/en/content/editorial-manual) (fetched 23 September 2026): written for formal United Nations documents; used as a fallback where neither of the above covers a case, and adapted for web/UI where a document-writing rule doesn't translate directly. The UNDRR Publications SOP itself is built on this manual. - [United Nations Disability-Inclusive Communications Guidelines](https://www.un.org/sites/un2.un.org/files/un_disability-inclusive_communication_guidelines.pdf) (Department of Global Communications, March 2022; fetched 23 September 2026): authoritative for disability inclusive language and terminology specifically. Its own terminology table is itself sourced from the Disability-Inclusive Language Guidelines of the United Nations Office at Geneva. - **DPI Gender Checklist for Content Creators** (Focal Points for Women and Gender, Department of Public Information, 2018; not confirmed to have a stable public URL, so a copy was provided directly and checked 23 September 2026): a one-page checklist for editorial teams; only its word-level "Check your words" guidance is in scope here. The rest of the checklist (narrative balance, image diversity, quantitative speaking-time checks) is content-strategy guidance for editorial teams producing stories, photography and video, not a mechanical style rule for a component library, so it isn't reproduced in this doc. For UX writing principles (plain language, inclusive language, front-loading, writing for two audiences), see [Writing guidelines](https://github.com/unisdr/undrr-mangrove/blob/main/docs/WRITING.md) instead. This doc doesn't repeat those. ## Where these rules apply The UNDRR Publications SOP and the United Nations Editorial Manual are written for publications and formal documents. Their rules apply to long-form content (reports, articles, page body copy) and to interface microcopy (button labels, error and status messages, form help text) alike. Where a print rule doesn't translate to the web, the rule says so and gives the web/UI equivalent, as for list punctuation and italics. Everything users see must follow these rules: component copy, default labels and messages, static templates and Storybook content written for UNDRR audiences. Mangrove's own developer docs and changelogs follow them too. Older developer docs are being brought in line gradually rather than in one sweep, so fix what you touch. ## Capitalization - **Page and heading titles**: sentence case, capitalizing only the first word and proper nouns. ([UN Geneva style guide, Capitalization](https://www.ungeneva.org/en/styleguide)) This matches Mangrove's existing "sentence case for all headings and titles" rule in [Writing guidelines](https://github.com/unisdr/undrr-mangrove/blob/main/docs/WRITING.md). - **Menu items and nav labels**: capitalize each major word (skip articles, conjunctions, prepositions). This is the one case where UN Geneva's web guide departs from sentence case, so use it specifically for menu/nav-style labels, not page headings. un.org follows the same convention, and the MegaMenu story data already does. ([UN Geneva style guide, Capitalization](https://www.ungeneva.org/en/styleguide)) - **Buttons, card links, captions**: capitalize the first word and proper nouns only, same as page headings. ([UN Geneva style guide, Capitalization](https://www.ungeneva.org/en/styleguide)) - **Table cells**: capitalize the first word in every cell. ([UN Geneva style guide, Capitalization](https://www.ungeneva.org/en/styleguide)) - **Generic terms stay lowercase** unless they're part of an official name: "press release" and "human rights" are lowercase; "Summit of the Future" is capitalized because it names a specific event. ([UN Geneva style guide, Capitalization](https://www.ungeneva.org/en/styleguide)) - **Titles/roles are capitalized only when concrete**, not generic: "the Director's" role and office are lowercase in general reference; "Project Director, Strategic Heritage Plan" is capitalized as an actual title. ([UN Geneva style guide, Capitalization](https://www.ungeneva.org/en/styleguide); [United Nations Editorial Manual, Capitalization](https://www.un.org/dgacm/en/content/editorial-manual/capitalization)) - **Small-letter proper nouns and product names stay lowercase even at the start of a heading**, for example `e-subscription` and `iSeek`. In component names and prop values, this means don't force-capitalize a brand or product string that's deliberately lowercase-led. ([UN Geneva style guide, Capitalization](https://www.ungeneva.org/en/styleguide)) ## Punctuation - **Colon and semicolon**: no space before them; continue with a lower-case letter after. ([UN Geneva style guide, Punctuation](https://www.ungeneva.org/en/styleguide)) - **Comma**: no serial (Oxford) comma before "and" in a simple list: "organs, organizations and bodies", not "organs, organizations, and bodies". ([United Nations Editorial Manual, Punctuation](https://www.un.org/dgacm/en/content/editorial-manual/punctuation)) - **Ampersand (`&`)**: fine in UI chrome (buttons, menu items) but avoid in running text unless it's part of a title; put a space on both sides. ([UN Geneva style guide, Punctuation](https://www.ungeneva.org/en/styleguide)) - **Slash (`/`)**: no space on either side when used to separate words. The United Nations Editorial Manual goes further for prose and discourages it outright in favour of "and"/"or" since its meaning is unclear. Apply that stricter rule in component prop docs and error copy, where ambiguity is costly. ([UN Geneva style guide, Punctuation](https://www.ungeneva.org/en/styleguide); [United Nations Editorial Manual, Punctuation](https://www.un.org/dgacm/en/content/editorial-manual/punctuation)) - **Full stop at the end of UI text**: skip it for short style elements (accordion headings, button/link text, list items in short lists) unless the item is a full sentence. Do use one to end running text/body copy. Never end a link or button with a full stop or exclamation mark unless it's the end of a complete sentence in running text. ([UN Geneva style guide, Punctuation](https://www.ungeneva.org/en/styleguide) and [Links](https://www.ungeneva.org/en/styleguide)) - **Quotation marks**: use only for actual quotes, not to "flag" a word. A full stop goes inside the closing quotation mark only if the entire sentence is inside the quote; otherwise it goes outside. ([UN Geneva style guide, Punctuation](https://www.ungeneva.org/en/styleguide)) The UNDRR Publications SOP allows one specific exception: double quotation marks around a specialized term the first time it's introduced (e.g. defining "residual risk" in body copy or a glossary entry). That's the only UI case where quoting a single word is correct; don't extend it to ordinary emphasis. (UNDRR Publications SOP, Quotations) - **En dash (`–`)**: use it where the United Nations Editorial Manual does. Number/year/date ranges (`2–4 per cent`, `2015–2030`, `11–13 December`) and joined pairs (`cost–benefit ratio`) take an unspaced en dash, not a hyphen, as in the official title of the Sendai Framework for Disaster Risk Reduction 2015–2030. In running text, "from 2015 to 2030" also works. A spaced en dash can mark an interruption in thought (`The way in which such changes – including hazard intensity – affect human activity...`), but a comma, colon or parentheses usually reads just as well, so use it sparingly. ([United Nations Editorial Manual, Punctuation](https://www.un.org/dgacm/en/content/editorial-manual/punctuation) and [Numbers, dates and time](https://www.un.org/dgacm/en/content/editorial-manual/numbers-dates-time); UNDRR Publications SOP, Punctuation) - **No em dashes (`—`)**: United Nations style uses a spaced en dash where other styles use an em dash, and Mangrove prefers a comma, colon or parentheses in most of those places. ([United Nations Editorial Manual, Punctuation](https://www.un.org/dgacm/en/content/editorial-manual/punctuation)) - **No dashes as separators in structured text**: changelog entries, labels and metadata lines use a comma or colon (`- **1.4.3**, 2026-09-17 ([#1190](url)): Description`), not a dash. Dashes there add nothing and are easily mangled by systems with the wrong character encoding. When a full sentence follows such a label, as in a changelog entry, it starts with a capital letter; a short fragment ("[Writing guidelines](https://github.com/unisdr/undrr-mangrove/blob/main/docs/WRITING.md): UX writing principles") stays lower case, as after any colon. (Mangrove convention) - **No apostrophe on an abbreviation's plural**: `NGOs`, not `NGO's`. (UNDRR Publications SOP, Punctuation) - **Lists**: no punctuation after short list items; a full stop after each item only if items are full sentences; never a semicolon between items in UI lists; no "and"/"or" tacked onto the last item; capitalize an item's first word only if the item is a full sentence. ([UN Geneva style guide, Lists](https://www.ungeneva.org/en/styleguide)) The UNDRR Publications SOP uses a semicolon between items for print/document lists. That's a print convention for long-form documents, not the UI rule above; don't apply it to Mangrove component lists. ## Numbers and dates - **Words vs. figures**: spell out numbers below 10 ("eight children"); use figures from 10 up, and always use figures for percentages, decimals, ratios, measurements, temperatures, money, ages and voting results (e.g. "1% increase", "10.5°C", "$6.50", "15 votes to none"). ([UN Geneva style guide, Numbers, dates & times](https://www.ungeneva.org/en/styleguide); [United Nations Editorial Manual, Numbers, dates and time](https://www.un.org/dgacm/en/content/editorial-manual/numbers-dates-time)) - **Large numbers**: pair millions/billions/trillions with a decimal numeral: "1.5 million", not "1,500,000" in running copy. ([UN Geneva style guide, Numbers, dates & times](https://www.ungeneva.org/en/styleguide)) Where a figure is shown in full rather than abbreviated (a table cell, a stat card), use a comma for four digits or more ("1,000", "12,452") and always a decimal point, never a decimal comma. (UNDRR Publications SOP, Numbers, dates and time) - **Percentages**: figure directly followed by `%` with no space ("25%"), except at the start of a sentence, where both are spelled out: "Twenty-five per cent". The United Nations Editorial Manual writes "per cent" in running text (as in its `2–4 per cent` range example above); in Mangrove UI copy and UNDRR content, follow the SOP and use `%`. (UNDRR Publications SOP, Numbers, dates and time) - **Space between a number and its unit**: `10 cm`, `2 m`, `4 kg`. A space always separates them, except the percentage and degree symbols, which are closed up to the number (`25%`, `1.5°C`, `90°N`). This is a common miss in stat cards and measurement labels. (UNDRR Publications SOP, Numbers, dates and time; United Nations Editorial Manual, Numbers, dates and time) - **Dates**: day, then month spelled out, then year, no punctuation: "12 January 2026", not "Jan 12, 2026" or "12/01/2026". This matches Mangrove's existing "10 October 2025" example in [Writing guidelines](https://github.com/unisdr/undrr-mangrove/blob/main/docs/WRITING.md); this doc gives the rule behind that example. ([UN Geneva style guide, Numbers, dates & times](https://www.ungeneva.org/en/styleguide)) - **Decades**: "the 1990s", with no apostrophe. ([United Nations Editorial Manual, Numbers, dates and time](https://www.un.org/dgacm/en/content/editorial-manual/numbers-dates-time)) - **Time**: 12-hour clock, `a.m.`/`p.m.`, a point (not a colon) between hours and minutes, no minutes shown on the hour: "9 a.m.", "8.30 p.m.". A UI component showing a machine-readable timestamp (e.g. a `