Home/Markdown to HTML, one styled file
Convert
Markdown to HTML: two exports, two destinations
A downloaded .html file and Copy styled HTML both turn Markdown into HTML, but they are built for different places. One is a file you host or open, the other is markup you paste.
Which export goes where
Both exports come from the same rendered document and the same theme. What differs is the shape of the HTML each one produces and where that shape works.
| Export | What you get | Where it belongs |
|---|
| Download .html | One file, theme CSS embedded, fonts linked | Hosting, attaching, opening from disk |
| Copy styled HTML | Markup with each element's styles inlined | Pasting into an email or a CMS editor |
A CMS or wiki editor that accepts pasted rich text takes Copy styled HTML. Anything you host, attach to a message, or open straight from disk takes the file instead.
Both start the same way.
- Paste your Markdown into the editor.
- Pick a theme from the preview header; only that theme's fonts load.
- Open the export menu on the preview header and choose the export you need.
What is inside the downloaded file
"Download .html" writes one file: the rendered document, the theme's CSS in a single <style> block, and a link to that theme's Google Fonts. For the worked example below, that is Inter.
Rendering and exporting both run in your browser, so building the file uploads nothing. There is no script tag in it, so nothing runs when the file opens. It is the same base CSS and theme CSS the live preview already uses.
Nothing in the file depends on markdown.style staying reachable, so it looks the same days later or on a computer that has never opened the site. Host it, attach it to a message, or open it straight from disk.
What Copy styled HTML puts on the clipboard
"Copy styled HTML" clones the rendered document and inlines each element's computed styles directly onto it, so there is no separate stylesheet to lose. That markup pastes into an email or a CMS editor and keeps its look there, without needing the destination to load anything from markdown.style.
List markers may not survive the paste. The numbered steps in the worked example below are the case to watch: check the pasted result before you send it.
Worked example
An internal help article: a table of environments, numbered steps, a bash fence and a keyboard shortcut written as raw HTML, rendered in the Slate theme.
# Deploying a service with shiprunner
`shiprunner` is the internal CLI for pushing a built service to one of our
three environments. It wraps the container registry, a health check and a
rollback in one command, so a deploy is one line once you are logged in.
This article covers setup, the deploy itself and how to watch a rollout land.
## Environments
| Environment | Region | Max instances | Approval |
| ----------- | ----------- | -------------- | ---------------- |
| dev | eu-west-1 | 2 | none |
| staging | eu-west-1 | 4 | none |
| production | us-east-1 | 12 | two reviewers |
Production deploys need two reviewers to approve the rollout before
`shiprunner` will move past the staging step, even when staging passed.
## Before you deploy
1. Install the CLI and confirm it is on your PATH.
2. Log in with `shiprunner login`, which opens a browser tab for SSO.
3. Check the account it picked up with `shiprunner whoami`.
4. Point the CLI at the right project before running anything else.
```bash
brew install shiprunner
shiprunner login
shiprunner whoami
shiprunner use payments-api
```
## Running the deploy
1. Tag the build you want to ship: `shiprunner tag build-482 v1.14.0`.
2. Start the rollout: `shiprunner deploy v1.14.0 --env staging`.
3. Repeat with `--env production` once staging passes its health check.
4. Watch the rollout finish; `shiprunner` exits non-zero if it rolls back.
Staging and production run the same image, so a version that passes staging
carries the same binary into production rather than a rebuild.
## Watching a rollout
The dashboard at deploy.internal opens automatically when a rollout starts.
Press <kbd>R</kbd> to refresh the log without reloading the page, and
<kbd>Esc</kbd> to close the panel and return to the project list.
## Rolling back
`shiprunner` rolls back on its own after three failed health checks in a
row. To roll back sooner, run `shiprunner rollback payments-api`, which
returns the environment to the last build that passed its health check.
Deploying a service with shiprunner
shiprunner is the internal CLI for pushing a built service to one of our
three environments. It wraps the container registry, a health check and a
rollback in one command, so a deploy is one line once you are logged in.
This article covers setup, the deploy itself and how to watch a rollout land.
Environments
| Environment |
Region |
Max instances |
Approval |
| dev |
eu-west-1 |
2 |
none |
| staging |
eu-west-1 |
4 |
none |
| production |
us-east-1 |
12 |
two reviewers |
Production deploys need two reviewers to approve the rollout before
shiprunner will move past the staging step, even when staging passed.
Before you deploy
- Install the CLI and confirm it is on your PATH.
- Log in with
shiprunner login, which opens a browser tab for SSO.
- Check the account it picked up with
shiprunner whoami.
- Point the CLI at the right project before running anything else.
brew install shiprunner
shiprunner login
shiprunner whoami
shiprunner use payments-api
Running the deploy
- Tag the build you want to ship:
shiprunner tag build-482 v1.14.0.
- Start the rollout:
shiprunner deploy v1.14.0 --env staging.
- Repeat with
--env production once staging passes its health check.
- Watch the rollout finish;
shiprunner exits non-zero if it rolls back.
Staging and production run the same image, so a version that passes staging
carries the same binary into production rather than a rebuild.
Watching a rollout
The dashboard at deploy.internal opens automatically when a rollout starts.
Press R to refresh the log without reloading the page, and
Esc to close the panel and return to the project list.
Rolling back
shiprunner rolls back on its own after three failed health checks in a
row. To roll back sooner, run shiprunner rollback payments-api, which
returns the environment to the last build that passed its health check.
Rendered in the Slate theme. Open it in the editor to change the theme or the text.
Raw HTML inside Markdown
The keyboard shortcut in the example above, R and Esc, is written as raw <kbd> tags inside the Markdown, not a Markdown construct of its own. An inline tag like that renders inline. A block tag written at the start of a line renders as a block, and a blank line around it lets Markdown inside the block render too.
Markdown itself has no keyboard-key syntax, so raw HTML is what puts a <kbd> tag, or anything else Markdown has no shortcut for, into the document.
Styling pasted this way never wins. Style tags, style attributes and scripts are removed before the document renders, so a pasted <div style="..."> keeps its structure but not its inline colour or spacing.
The theme decides how a heading, a table or that R key look. That holds in the live preview, in the downloaded file, and in a paste made with Copy styled HTML.
Questions
Does the downloaded file include any JavaScript?
No. It is the rendered document, the theme's CSS in one style block and a link to its Google Fonts. There is no script tag and nothing runs when the file opens.
Why did my bulleted list lose its markers after I pasted it?
Copy styled HTML inlines each element's styles instead of shipping a stylesheet. List markers are one of the things that do not always survive that trip into another editor.
My raw HTML had a style attribute. Why is it gone?
The sanitizer removes style tags and style attributes from pasted HTML, along with scripts, so the theme is the only thing controlling the page.
Can the .html file be opened without an internet connection?
Yes, the document and its layout are all in the file. The theme's fonts are linked from Google Fonts, so the text shows in a fallback font until a connection is available.