Skip to content
Home

Anchor (Text Link)

Info
Demos
Properties

Properties

PropertiesDescription
element(optional) define what HTML or React element should be used (e.g. element={Link}). Defaults to semantic a element.
href(optional) relative or absolute url.
to(optional) use this prop only if you are using a router Link component as the element that uses the to property to declare the navigation url.
target(optional) defines the opening method. Use _blank to open a new browser window/tab.
targetBlankTitle(optional) the title shown as a tooltip when target is set to _blank.
tooltip(optional) Provide a string or a React Element to be shown as the tooltip content.
icon(optional)Primary Icons can be set as a string (e.g. icon="chevron_right"), other icons should be set as React elements.
iconPosition(optional)left (default) or right. Places icon to the left or to the right of the text.
skeleton(optional) if set to true, an overlaying skeleton with animation will be shown.
Space(optional) spacing properties like top or bottom are supported.

Router Link

You can make use of the element property in combination with the to property.

import { Link } from 'gatsby'


render(
  <Anchor to="/url" element={Link}>
    Link
  </Anchor>,
)