import Layout from 'lib/components/layout'
import { Code, Link, Text, Spacer, Note } from 'components'

export const meta = {
  title: 'introduction',
  group: 'getting-started',
  index: 5,
}

## Introduction

### About

**Geist UI** is a React implementation for <Link rel="nofollow" target="_blank" href="https://github.com/geist-org/style">styles</Link>
originating from <Link rel="nofollow" target="_blank" href="https://vercel.co/design">Vercel's design</Link>.

The design of Vercel is concise and aesthetic, this is an important reason for popularity of Vercel.
Now you can implement the styles in your own React project.

Geist UI is an open-source design system for building modern websites and applications, all our projects are open source.

<Spacer y={3} />

### Contact

- <Link
    color
    target="_blank"
    rel="nofollow"
    href="https://github.com/geist-org/react/issues/new">
    Report an issue
  </Link>
- <Link
    color
    target="_blank"
    rel="nofollow"
    href="https://github.com/geist-org/react/discussions">
    Chat on GitHub Discussions
  </Link>
- We welcome feedback and ideas. We also love PRs.

<Spacer y={3} />

### License

Licensed under the [MIT LICENSE](https://github.com/geist-org/react/blob/master/LICENSE).

export default ({ children }) => <Layout meta={meta}>{children}</Layout>
