Link

Examples

Links are used to embed actions or pathways to more information within a sentence.

The Link component simply styles the child element that you pass to it. You bring all your own semantics or links that support client-side routing.

Lorem ipsum dolor sit amet basic link nisi ut aliquip ex ea commodo consequat.

Lorem ipsum dolor sit amet subtle link nisi ut aliquip ex ea commodo consequat.

import React from 'react'
import Link from '@pluralsight/ps-design-system-link'
const Comp = () => (
<div className="example-flex-column">
<p>
Lorem ipsum dolor sit amet{' '}
<Link>
<a href="https://duckduckgo.com">basic link</a>
</Link>{' '}
nisi ut aliquip ex ea commodo consequat.
</p>
<p>
Lorem ipsum dolor sit amet{' '}
<Link appearance={Link.appearances.subtle}>
<a href="https://duckduckgo.com">subtle link</a>
</Link>{' '}
nisi ut aliquip ex ea commodo consequat.
</p>
</div>
)
export default Comp

Usage & Types

  • Version
  • Install
    npm install @pluralsight/ps-design-system-link
  • Import
    import Link from '@pluralsight/ps-design-system-link'
Name
Type
Description
Default
appearance
default | subtle
visual style (from Link.appearances)default