Component

BackLink

Render a compact return link with a leading line, muted default state, and accent hover treatment.

Usage

Import the component entry and start with its smallest complete example.

Import

import { BackLink } from "@chitrank2050/monoline-ui/back-link"

Basic usage

<BackLink href="/projects">
  Back to projects
</BackLink>

Usage guidance

Choose the component for its interaction model and semantics before customizing its appearance.

Use when

BackLink gives readers a short, stable route to a parent page or the previous content level.

Avoid when

You need an in-place action or true browser-history behavior instead of a stable destination.

Accessibility

BackLink is an anchor by default, and its decorative line is hidden from assistive technology. Provide href and descriptive text, and preserve link semantics when overriding as.

Server Component

This component can render without adding a Monoline client boundary when its children and props are serializable.

API reference

Props, slots, and callbacks available on this component.

hrefstringDestination for the anchor element

asElementTypeOptional element or router link component

childrenReactNodeVisible link label

classNamestringAdditional class names

Design tokens

Theme variables this component reads for color, spacing, and motion.

--text-mutedCSS varDefault link text color

--accentCSS varHover text and line color

--space-2CSS varGap between line and label

--duration-shortCSS varLine and color transition timing

Implementation

The source used by the example above, including any state it needs.

import { BackLink } from "@chitrank2050/monoline-ui/back-link"

export function ProjectBackLink() {
  return <BackLink href="/projects">Back to projects</BackLink>
}

Compare related components or review the package and theme setup.

01ComponentButtonComponent · ReferenceReference→02ComponentNavbarComponent · ReferenceReference→03SetupInstall Monoline UISetup · GuideGuide→04ThemeTailwind CSS v4 design tokensTheme · FoundationsFoundations→

Interactive preview