The spacy.io website is implemented using Gatsby with Remark and MDX. This allows authoring content in straightforward Markdown without the usual limitations. Standard elements can be overwritten with powerful React components and wherever Markdown syntax isn’t enough, JSX components can be used.

Logo

Source

If you would like to use the spaCy logo on your site, please get in touch and ask us first. However, if you want to show support and tell others that your project is using spaCy, you can grab one of our spaCy badges.

Colors

Patterns

Typography

Headlines are set in HK Grotesk by Hanken Design. All other body text and code uses the best-matching default system font to provide a “native” reading experience. All code uses the JetBrains Mono typeface by JetBrains.

The following optional attributes can be set on the headline to modify it. For example, to add a tag for the documented type or mark features that have been introduced in a specific version or require statistical models to be loaded. Tags are also available as standalone <Tag /> components.

Elements

Links

Special link styles are used depending on the link URL.

• I am a regular external link
• I am a link to the documentation
• I am a link to an architecture
• I am a link to a model
• I am a link to GitHub

Abbreviations

Some text with an abbreviation. On small screens, I collapse and the explanation text is displayed next to the abbreviation.

Tags

Tags can be used together with headlines, or next to properties across the documentation, and combined with tooltips to provide additional information. An optional variant argument can be used for special tags. variant="new" makes the tag take a version number to mark new features. Using the component, visibility of this tag can later be toggled once the feature isn’t considered new anymore. Setting variant="model" takes a description of model capabilities and can be used to mark features that require a respective model to be installed.

method v4.0 Needs model

Buttons

Link buttons come in two variants, primary and secondary and two sizes, with an optional large size modifier. Since they’re mostly used as enhanced links, the buttons are implemented as styled links instead of native button elements.

Primary small Secondary small

Primary small Secondary small

Components

Table

Tables are used to present data and API documentation. Certain keywords can be used to mark a footer row with a distinct style, for example to visualize the return values of a documented function.

Tables also support optional “divider” rows that are typically used to denote keyword-only arguments in API documentation. To turn a row into a dividing headline, it should only include content in its first cell, and its value should be italicized:

Type Annotations

Type annotations are special inline code blocks are used to describe Python types in the type hints format. The special component will split the type, apply syntax highlighting and link all types that specify links in meta/type-annotations.json. Types can link to internal or external documentation pages. To make it easy to represent the type annotations in Markdown, the rendering “hijacks” the ~~ tags that would typically be converted to a <del> element – but in this case, text surrounded by ~~ becomes a type annotation.

• Dict[str, List[Union[Doc,Span]]]
• Model[List[Doc], List[numpy.ndarray]]

Type annotations support a special visual style in tables and will render as a separate row, under the cell text. This allows the API docs to display complex types without taking up too much space in the cell. The type annotation should always be the last element in the row.

List

Lists are available as bulleted and numbered. Markdown lists are transformed automatically.

• I am a bulleted list
• I have nice bullets
• Lorem ipsum dolor
• consectetur adipiscing elit

1. I am an ordered list
2. I have nice numbers
3. Lorem ipsum dolor
4. consectetur adipiscing elit

Aside

Asides can be used to display additional notes and content in the right-hand column. Asides can contain text, code and other elements if needed. Visually, asides are moved to the side on the X-axis, and displayed at the same level they were inserted. On small screens, they collapse and are rendered in their original position, in between the text.

To make them easier to use in Markdown, paragraphs formatted as blockquotes will turn into asides by default. Level 4 headlines (with a leading ####) will become aside titles.

Code Block

Code blocks use the Prism syntax highlighter with a custom theme. The language can be set individually on each block, and defaults to raw text with no highlighting. An optional label can be added as the first line with the prefix #### (Python-like) and /// (JavaScript-like). the indented block as plain text and preserve whitespace.

Using spaCy

Code blocks and also specify an optional range of line numbers to highlight by adding {highlight="..."} to the headline. Acceptable ranges are spans like 5-7, but also 5-7,10 or 5-7,10,13-14.

Using the matcher

Adding {executable="true"} to the title turns the code into an executable block, powered by Binder and Juniper. If JavaScript is disabled, the interactive widget defaults to a regular code block.

Editable CodespaCy v3.7 · Python 3 · via Binder
run

If a code block only contains a URL to a GitHub file, the raw file contents are embedded automatically and syntax highlighting is applied. The link to the original file is shown at the top of the widget.

explosion/spaCy/master/spacy/language.py

Infobox

Infoboxes can be used to add notes, updates, warnings or additional information to a page or section. Semantically, they’re implemented and interpreted as an aside element. Infoboxes can take an optional title argument, as well as an optional variant (either "warning" or "danger").

Accordion

Accordions are collapsible sections that are mostly used for lengthy tables, like the tag and label annotation schemes for different languages. They all need to be presented – but chances are the user doesn’t actually care about all of them, especially not at the same time. So it’s fairly reasonable to hide them begin a click. This particular implementation was inspired by the amazing Inclusive Components blog.

Markdown reference

All page content and page meta lives in the .mdx files in the /docs directory. The frontmatter block at the top of each file defines the page title and other settings like the sidebar menu.

In addition to the native markdown elements, you can use the components <Infobox />, <Accordion />, <Abbr /> and <Tag /> via their JSX syntax.

Editorial

• “spaCy” should always be spelled with a lowercase “s” and a capital “C”, unless it specifically refers to the Python package or Python import spacy (in which case it should be formatted as code).
  • spaCy is a library for advanced NLP in Python.
  • Spacy is a library for advanced NLP in Python.
  • First, you need to install the spacy package from pip.
• Mentions of code, like function names, classes, variable names etc. in inline text should be formatted as code.
  • “Calling the nlp object on a text returns a Doc.”
• Objects that have pages in the API docs should be linked – for example, Doc or Language.to_disk. The mentions should still be formatted as code within the link. Links pointing to the API docs will automatically receive a little icon. However, if a paragraph includes many references to the API, the links can easily get messy. In that case, we typically only link the first mention of an object and not any subsequent ones.
  • The Span and Token objects are views of a Doc. Span.as_doc creates a Doc object from a Span.
  • The Span and Token objects are views of a Doc. Span.as_doc creates a Doc object from a Span.
• Other things we format as code are: references to trained pipeline packages like en_core_web_sm or file names like code.py or meta.json.
  • After training, the config.cfg is saved to disk.
• Type annotations are a special type of code formatting, expressed by wrapping the text in ~~ instead of backticks. The result looks like this: List[Doc]. All references to known types will be linked automatically.
  • The model has the input type List[Doc] and it outputs a List[Array2d].
• We try to keep links meaningful but short.
  • For details, see the usage guide on training with custom code.
  • For details, see the usage guide on training with custom code.
  • For details, see the usage guide on training with custom code here.