---
name: Link
menu: Components
---

import PropsTable from 'website-src/components/PropsTable'
import { livePreviewStyle } from '../helpers/constants'
import Link from './Link'
import cactusTheme from '@repay/cactus-theme'
import { LiveProvider, LiveEditor, LiveError, LivePreview } from 'react-live'

# Link

### Try it out

export const code = `<Link to="https://google.com">
  Go to google
</Link>`

<LiveProvider code={code} scope={{ Link }}>
  <LiveEditor style={livePreviewStyle} />
  <LiveError />
  <LivePreview />
</LiveProvider>

## Basic usage

The `Link` component can be used by passing the url in the `to` prop, and providing the desired text as the children.

```jsx
import React from 'react'
import { Link } from '@repay/cactus-web'

const MyComponent = props => {
  // normal component things here
  return (
    <div>
      <Link to="https://google.com">Go to google</Link>
      // rest of component
    </div>
  )
}
```

## Properties

<PropsTable of={Link} />