CSSAny theme
# Auto-align Images CSS Snippet for Obsidian
This CSS snippet automatically centers all images (JPEG, PNG, etc.) in your Obsidian notes when in **Preview Mode**. It ensures a clean and consistent layout for images in your notes, improving the visual presentation.
## Copyright : Siam Mehraf
## Website : https://siammehraf.net
## Features
- **Auto-centering**: All images will be centered in Obsidian's preview mode.
- **Simple and easy to implement**: Just add the CSS snippet to your Obsidian CSS folder.
## Instructions to Use
### Step 1: Download the CSS File
1. Download or copy the `Auto-align Images CSS Snippet for Obsidian` file from this repository.
### Step 2: Add the CSS Snippet to Obsidian
1. Open Obsidian.
2. Go to **Settings** (click the gear icon in the lower-left corner).
3. Under the **Appearance** tab, scroll down to **CSS snippets**.
4. Click **Open snippets folder**.
- If you don’t see the "CSS snippets" option, make sure you have enabled **Custom CSS** under **Appearance** settings.
5. Place the `Auto-align Images CSS Snippet for Obsidian` file into the **snippets** folder.
6. After adding the file, go back to the **CSS snippets** section in Obsidian settings.
7. Enable the snippet by toggling the switch next to `Auto-align Images CSS Snippet for Obsidian`.
### Step 3: View in Preview Mode
- This snippet only works in **Preview Mode**. Switch to preview mode by clicking on the **Preview** button (the eye icon) in the upper-right corner of your note or by using the shortcut `Ctrl/Cmd + E`.
The images in your notes will now be automatically centered when viewing the note in preview mode.
## Notes
- This CSS snippet affects only the **preview mode** of your notes in Obsidian. It won’t change the appearance of images in **Edit Mode**.
- If you want to modify or customize this snippet, feel free to edit the `Auto-align Images CSS Snippet for Obsidian` file to suit your needs.
---
Feel free to reach out to me at [siammehraf.net](https://siammehraf.net) for any questions or feedback.
How to Install
- Download the CSS file below
- Move it to your vault's
.obsidian/snippets/folder - Open Obsidian → Settings → Appearance → CSS Snippets → Enable it
Stats
Stars
0
Forks
0
Last updated 14mo ago