DEV Community

Cover image for ✍️ Markdown Basics ✨
Himanay Khajuria
Himanay Khajuria

Posted on

2

✍️ Markdown Basics ✨

Have you ever wondered how people write beautiful, well-structured text without using fancy software? The answer is Markdown! 📝

Markdown is a lightweight markup language that helps you format text easily. It’s simple to learn and widely used in documentation, blogging, GitHub README files and note-taking apps.

In this quick blog, I’ll take you from newbie to ninja in Markdown. Let’s start! 🎬


📝 Introduction to Markdown

Markdown is a simple and lightweight way to format text. Instead of using complex tools like Microsoft Word, you can format text with symbols and characters. It’s used for writing blogs, notes, documentation and even websites!


📌 Why Should You Use Markdown?

Here’s why Markdown is awesome:

Easy to Learn ➥ Uses simple symbols for formatting.

Saves Time ➥ No need for complicated formatting tools.

Works Everywhere ➥ Used in GitHub, Notion, Obsidian, and more.

Converts to HTML ➥ You can easily turn Markdown into a website.

Now, let’s learn how to use Markdown! 🛠️


🔡 Basic Markdown Syntax

Markdown uses symbols to format text. Let’s see how!

🏷 Headings

Headings are created using the # symbol.

# Heading 1
## Heading 2
### Heading 3
Enter fullscreen mode Exit fullscreen mode

Output:

Heading 1

Heading 2

Heading 3

💡 Use more # symbols for smaller headings!


🔠 Bold & Italics

You can make text bold or italic easily.

**This is bold text**
*This is italic text*
Enter fullscreen mode Exit fullscreen mode

Output:

This is bold text
This is italic text


📜 Lists

✅ Unordered List (Bullet Points)

Use -, *, or + for bullet points.

- Apple
- Banana
  - Yellow Banana
  - Green Banana
- Mango
Enter fullscreen mode Exit fullscreen mode

Output:

  • Apple
  • Banana
    • Yellow Banana
    • Green Banana
  • Mango

🔢 Ordered List (Numbered List)

Just use numbers!

1. First Item
2. Second Item
3. Third Item
Enter fullscreen mode Exit fullscreen mode

Output:

  1. First Item
  2. Second Item
  3. Third Item

🔗 Adding Links

To insert a link, use [text](URL).

[Visit Google](https://www.google.com)
Enter fullscreen mode Exit fullscreen mode

Output:

Visit Google


🖼 Adding Images

To insert an image, use ![Alt Text](image_url).

![Markdown Logo](https://upload.wikimedia.org/wikipedia/commons/4/48/Markdown-mark.svg)
Enter fullscreen mode Exit fullscreen mode

Output:

Markdown Logo


💻 Code Blocks

Inline Code

Use single backticks for inline code.

This is `inline code`.
Enter fullscreen mode Exit fullscreen mode

Output:

This is inline code.

Multi-line Code Block

Use triple backticks for larger code blocks.

(triple backticks) print("Hello, World!") (triple backticks)
Enter fullscreen mode Exit fullscreen mode

Output:

 print("Hello, World!")
Enter fullscreen mode Exit fullscreen mode

🗨 Quotes (Blockquotes)

Use > for blockquotes.

> This is a quote.
> Markdown makes writing easy!
Enter fullscreen mode Exit fullscreen mode

Output:

This is a quote.
Markdown makes writing easy!


➖ Horizontal Line

Use --- or *** to create a separator.

---
Enter fullscreen mode Exit fullscreen mode

Output:


✅ Task Lists

You can create checklists using - [ ] for unchecked and - [x] for checked items.

- [x] Completed Task
- [ ] Pending Task
Enter fullscreen mode Exit fullscreen mode

Output:

  • [x] Completed Task
  • [ ] Pending Task

🔥 Extended Markdown Syntax

Markdown also has some extra features!

📊 Creating Tables

Use | and - to create tables.

| Name   | Age | Country  |
|--------|-----|---------|
| Alice  | 25  | USA     |
| Bob    | 30  | Canada  |
Enter fullscreen mode Exit fullscreen mode

Output:

Name Age Country
Alice 25 USA
Bob 30 Canada

🤩 Emojis

You can add emojis using :emoji_name:.

I love Markdown! 🎉 :joy:
Enter fullscreen mode Exit fullscreen mode

Output:

I love Markdown! 🎉 😍


📌 Footnotes

You can add footnotes using [^1].

This is an example of a footnote.[^1]  

[^1]: This is the footnote text.
Enter fullscreen mode Exit fullscreen mode

Output:

This is an example of a footnote.1


🎯 Where is Markdown Used?

Markdown is used in many places!
📌 GitHub ➥ Writing README files and documentation.
📌 Notion & Obsidian ➥ Taking structured notes.
📌 Jekyll & Hugo ➥ Writing blogs.
📌 Slack & Discord ➥ Formatting messages.


🏆 Conclusion

Markdown is super easy to learn and extremely useful! 🔑

Start using it today for:
✅ Notes
✅ Blogs
✅ Documentation
✅ Websites

With just a few simple symbols, you can format text beautifully!

🖇️ Learning Resources

A quick reference to the Markdown syntax

➥ Check out my Technical Presentation along with the slide notes for a better understanding 🎥: 🔗 View Presentation

💼 Let’s connect on LinkedIn! 👥💬

Happy Writing! ✍️🤗 ♡


  1. This is the footnote text.  

Heroku

Built for developers, by developers.

Whether you're building a simple prototype or a business-critical product, Heroku's fully-managed platform gives you the simplest path to delivering apps quickly — using the tools and languages you already love!

Learn More

Top comments (0)

Hot sauce if you're wrong - web dev trivia for staff engineers

Hot sauce if you're wrong · web dev trivia for staff engineers (Chris vs Jeremy, Leet Heat S1.E4)

  • Shipping Fast: Test your knowledge of deployment strategies and techniques
  • Authentication: Prove you know your OAuth from your JWT
  • CSS: Demonstrate your styling expertise under pressure
  • Acronyms: Decode the alphabet soup of web development
  • Accessibility: Show your commitment to building for everyone

Contestants must answer rapid-fire questions across the full stack of modern web development. Get it right, earn points. Get it wrong? The spice level goes up!

Watch Video 🌶️🔥

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay