Reflex
  • Blocks
    • Header
    • Hero
    • Features
    • Call to action
    • Forms
    • Pricing
    • Team
    • Testimonials
    • Cards
    • Footer
    • Posts
    • Videos
  • Examples
  • Learn
  • Videos
  • Docs
  • Theme

    Theme reference

    • Colors
    • Font family
    • Font size
    • Font weight
    • Line height
    • Box shadow
    Create a theme Extend base
arshadcnv0.5.3
Reflex
Reflex

MDX

MDX is the Markdown format extended to allows JSX components.

Reflex uses MDX for content. Pages, blocks, posts, and navs are all built using MDX. You can import components, such as blocks, and embed them within your content.

Components

Components can be imported or written inline with your Markdown content.

---
title: A page
---
import { Example } from "package"
# Heading 1
A paragraph officiis labore excepturi nam.
<Block src="hero" />
Another paragraph.
<Button>A button</Button> component.

Styling

Components in MDX files can be styled using style props.

---
title: A page
---
<P color="primary">A paragraph in primary color</P>
<H3 mb="4">A heading with margin bottom</H3>

See the Theme reference for style props values.

Configure your editorBuild a landing page

© 2020 Reflex

  • Blocks
  • Examples
  • Learn
  • Docs
  • Github