Links

Create hyperlinks, cross-references, and external links in your documentation.

2 min read

Links connect your documentation pages together and point to external resources. Mordoc supports standard markdown link syntax with automatic handling of external links.

Syntax

Create links using markdown bracket notation:

Markdown

[Link Text](URL)

Example

Syntax	Result
Markdown `[Mordoc docs](https://mordoc.dev)`	Mordoc docs

Link types

External links

Link to websites outside your documentation:

Syntax Result

Syntax	Result
Markdown `[Node.js Official Site](https://nodejs.org) [GitHub](https://github.com)`	Node.js Official Site GitHub

Markdown

[Node.js Official Site](https://nodejs.org)
[GitHub](https://github.com)

Node.js Official Site

GitHub

Internal links

Link to other pages within your documentation using paths:

Syntax Result

Syntax	Result
Markdown `[Create your first project](/get-started/creating-project) [Install Git](/prerequisites/git)`	Create your first project Install Git

Markdown

[Create your first project](/get-started/creating-project)
[Install Git](/prerequisites/git)

Create your first project

Install Git

Email links

Create mailto links:

Syntax	Result
Markdown `[Contact Support](mailto:support@example.com)`	Contact Support

Styling links

Mordoc provides sensible default styles for links. If you want to customize link colors to better match your brand, you can do so by adding a typography.json file under the config/styles/ directory.

This file allows you to control how links appear in both light and dark modes.

Available style variables

Variable	Description	Example HEX value
`linkColor`	Link color in light mode	`#171717`
`linkColorDark`	Link color in dark mode	`#fafafa`
`linkHoverColor`	Link color on hover in light mode	`#000000`
`linkHoverColorDark`	Link color on hover in dark mode	`#FFFFFF`

Example configurations

Blue links:

Json

{
  "linkColor": "#0665c4",
  "linkColorDark": "#61b1f2",
  "linkHoverColor": "#0a0b66",
  "linkHoverColorDark": "#93c5fd"
}

Green links:

Json

{
  "linkColor": "#059669",
  "linkColorDark": "#10b981",
  "linkHoverColor": "#047857",
  "linkHoverColorDark": "#34d399"
}

Next steps

Images - Embed images in your documentation
Lists - Create ordered and unordered lists
Code Blocks - Add syntax-highlighted code examples