The Markdown component allows you to insert content from Markdown files into your designs. Both .md and .markdown files are supported.
| Property | Type | Description | Default |
|---|---|---|---|
| Source | file |
Markdown file to be imported. | null |
| Theme | enum |
CSS Theme, see below. | Github |
| CSS File | file |
Custom CSS file, see below. | null |
| Padding | number |
Padding around the content. | 0 |
| Overflow | Show | Hide |
Overflow visibility. | Hide |
Out of the box, the Markdown component includes a handful of simple CSS themes.
You can also use your own theme! Just select Custom from the theme dropdown, then select a CSS file which contains your custom styles.
Notes on Custom Themes
- The container can be styled with a
:hostselector. - You should avoid styling
htmlorbodyfrom your theme file. - Due to the way styles are scoped, minified CSS files may introduce bugs.
| Name | Link |
|---|---|
| Chota | jenil/chota |
| Github | sindresorhus/github-markdown-css |
| Marx | mblode/marx |
| Sakura | oxalorg/sakura |
| Sakura Dark | oxalorg/sakura |
| Wing | kbrsh/wing |
- Syntax Highlighting (see Syntax Highlighter in the meantime)
- Actually fix theming bug
- Fixed a bug with theming
- Add Custom theme support
- Update Framer Store artwork
- Add basic theme support
- Set default theme to
Github
- Initial Release
Markdown parsing powered by Marked.
Markdown Mark designed by Dustin Curtis (@dcurtis).
Markdown invented by John Gruber via Daring Fireball.