| title | About |
|---|---|
| sort | 2 |
| description | Information about the Ripped Guide. |
The Ripped Guide stores 0 Cookies in your Browser.
We use Privacy-first Umami Analytics to measure site activity.
This does __not__ log any personal information apart from Country of Visit, Resolution, User-Agent and Referrer. If you wish to opt-out, install [**uBlock Origin**](https://github.com/gorhill/uBlock) on your browser.Feel free to contribute to the Guide by making a Pull Request or an Issue in our docs repo.
If you think you can help out with the code, feel free to make a PR in our site repo.
This website is built using Vite and React with a custom MDX rendering setup. You can write regular Markdown along with custom React components directly in .mdx files.
In brief, here's how a document works:
---
title: My Page
description: A short description for embeds
---
# Header
Here is normal text.
> Quote
## Subheading
Here is a [link](https://ripped.guide)
Here is *italic text*, **bold text**, and **_italic and bold text_**
Here is an unordered list:
- item 1
- item 2
Here is an ordered list:
1. item 1
2. item 2
Here is a superscript^1^
Here is a table:
| Column 1 | Column 2 | Column 3 |
| -------- | -------- | -------- |
| Value 1 | Value 2 | Value 3 |
You can also use HTML tags:
Here is
<u>underlined text</u>
Here is
<small>small text</small>
Here is
<span className="text-red-500">red color text</span>Here is normal text.
Quote
Here is a link.
Here is italic text, bold text, italic and bold text, and inline code.
Here is an unordered list:
- item 1
- item 2
Here is an ordered list:
- item 1
- item 2
Here is a superscript^1^.
Here is a table:
| Column 1 | Column 2 | Column 3 |
|---|---|---|
| Value 1 | Value 2 | Value 3 |
You can also use HTML tags:
Here is underlined text
Here is small text
Here is red color text
We provide several custom MDX components you can use anywhere within the .mdx files.
Alerts call attention to important information.
<Alert type="info">Here is some helpful information.</Alert>
<Alert type="warn">Watch out! This is a warning.</Alert>
<Alert type="danger">Danger! Do not proceed further.</Alert>Example:
Here is some helpful information. Watch out! This is a warning. Danger! Do not proceed further.
Collapsible sections help hide lengthy information behind an expandable header.
<Collapsible title="My Expandable Section" description="Click here to expand the section" icon="info">
Here is the hidden content!
</Collapsible>Example:
Here is the hidden content!Tabs allow you to structure content conditionally without taking up too much vertical space.
<Tabs>
<Tab label="Windows">Download the `.exe` file.</Tab>
<Tab label="macOS">Download the `.dmg` file.</Tab>
</Tabs>Example:
Download the `.exe` file. Download the `.dmg` file.Used to document API endpoints efficiently.
<RouteHeader method="GET" url="/api/v1/users/{user.id}" unauthenticated>
Get User Info
</RouteHeader>Example:
Get User InfoDisplays release notes in an organized timeline structure.
<Changelog>
<ChangelogEntry version="v1.2.0" date="October 24, 2026">
- Added a new feature - Fixed a bug
</ChangelogEntry>
<ChangelogEntry version="v1.1.0" date="September 5, 2026">
- Initial release
</ChangelogEntry>
</Changelog>Example:
- Added a new feature - Fixed a bug - Initial releaseEmbeds a YouTube video responsively.
<YouTubeEmbed src="https://www.youtube.com/embed/dQw4w9WgXcQ" />Example:
import Contributors from "@components/Contributors";