1. Moving Stuff Around

Use div tags to control where content sits on the page.

<div align="left">
    This text stays on the left.
</div>

<div align="center">
    This text is centered.
</div>

<div align="right">
    This text goes to the right.
</div>

2. Adding Links

Use brackets and parentheses to make clickable links.

[name](link)

3. Adding Images & Resizing

Use an exclamation mark plus a link to display an image.

![photo name](photo link)

Where to host images

• File Garden: for permanent digital assets and art.
• Catbox.moe: quick file hosting for raw image links.

Fixing giant images

Set a width so the image stays at a manageable size.

<img src="your-image-link.png" width="200" />

4. Writing

Use custom styling to make specific words or lines stand out from the rest of the page.

Dropdown text is a reveal-style block: a short heading appears first, and clicking the arrow shows the hidden content below it.

<details>
    <summary>Click me</summary>
    This is the hidden content that appears when the dropdown opens.
</details>

If you want a word/sentence to have color, you can use color markup:

$\color{#00AC60}{\text{This text is custom green}}$

5. Good Tools/Websites to Use

• SVG Gradient Map Filter: photos and GIFS with gradient maps.
• Shields.io: make colorful badge-style labels.
• hits.sh: track the amount of visits your github page has.
• kittinan/spotify: show your current or recent Spotify songs.

Need Help?

Just ask me on Atabook!