Markdown Cheat Sheet with Shields.io

sathwik adasathwik ada
3 min read

Markdown is a lightweight markup language that helps structure text. It’s widely used for documentation, especially in README files on GitHub, to give clear information about your project. This cheat sheet will guide you through the basics of Markdown and introduce you to Shields.io, which lets you add attractive badges to enhance your project’s presentation.


1. What is Markdown?

Markdown allows developers to write structured text quickly and easily. It turns plain text into rich formatted text using simple symbols. It is commonly used for README files on GitHub, wikis, and other documentation.


2. Markdown Basics

Headers

Use # for headings. The more # symbols you use, the smaller the heading size becomes.

# H1 - Main Title
## H2 - Section Title
### H3 - Subsection

Emphasis

  • Italic:

      *This text is italic.*
    
  • Bold:

      **This text is bold.**
    
  • Bold and Italic:

      ***This text is bold and italic.***
    

Lists

  • Unordered List:

      - Item 1
      - Item 2
          - Subitem 1
    
  • Ordered List:

      1. Step 1
      2. Step 2
    
  • Link:

      [Visit GitHub](https://github.com)
    
  • Image:

      ![Alt Text](https://example.com/image.png)
    

Code Blocks

  • Inline Code:

      `This is inline code.`
    
  • Multi-line Code Block:

    function hello() { console.log("Hello, World!"); }

Blockquotes

> This is a quote block.

Tables

| Feature  | Description |
|----------|-------------|
| Markdown | Easy syntax |
| GitHub   | Collaboration platform |

Task Lists

- [x] Completed task
- [ ] Incomplete task

3. Enhancing Your README with Shields.io Badges

Shields.io lets you add customizable badges to display important information (like version, build status, or license) on your project. This improves readability and makes your project stand out.

Adding a Basic Badge

The basic syntax for adding a badge is:

![Badge Text](https://img.shields.io/badge/<LABEL>-<MESSAGE>-<COLOR>)
  • LABEL: Describes the badge (e.g., "Build")

  • MESSAGE: Information (e.g., "Passing")

  • COLOR: Badge color (e.g., "brightgreen")

Example:

![Build Status](https://img.shields.io/badge/Build-Passing-brightgreen)

Rendered:

Build Status


Common Shields.io Badges

Here are some frequently used badges:

  • Version Badge:

      ![Version](https://img.shields.io/badge/version-1.0.0-blue)
    

    Version

  • License Badge:

      ![License](https://img.shields.io/badge/license-MIT-green)
    

    License

  • GitHub Issues Badge:

      ![GitHub Issues](https://img.shields.io/github/issues/owner/repository)
    

    Replace owner/repository with your GitHub repository details.


Customizing Shields.io Badges

  • Style Variants:
    Change the style to match your theme. Use flat, plastic, or for-the-badge styles:

      https://img.shields.io/badge/Build-Passing-brightgreen?style=for-the-badge
    
  • Adding Logos:
    Add a logo to your badge for better visualization:

      https://img.shields.io/badge/Code-GitHub-blue?logo=github
    
  • Dynamic Values:
    Shields.io supports dynamic badges like GitHub stars or downloads. Example:

      ![GitHub Stars](https://img.shields.io/github/stars/owner/repository?style=social)
    

4. Example README Using Markdown and Shields.io

Here’s an example of how a README.md file might look using Markdown and badges:

# My Awesome Project  
![Build Status](https://img.shields.io/badge/Build-Passing-brightgreen)  
![Version](https://img.shields.io/badge/version-1.0.0-blue)  
![License](https://img.shields.io/badge/license-MIT-green)  

## Overview  
This project is an example of how to use Markdown and Shields.io to create a neat and professional README.

## Features  
- Easy to use  
- Clean documentation  

## Getting Started  
1. Clone the repository:  
   ```bash
   git clone https://github.com/owner/repository.git
  1. Install dependencies:

     npm install
    

Contributing

We welcome contributions! Please open an issue or submit a pull request.

License

This project is licensed under the MIT License.


---

## **Conclusion**  
With Markdown, you can structure text efficiently, and Shields.io badges bring polish to your documentation. Together, they help create engaging and informative README files for your projects. Start using these tools today to showcase your projects like a pro!

---

Let me know if this article is good to go or if you need any more tweaks!
0
Subscribe to my newsletter

Read articles from sathwik ada directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

sathwik ada
sathwik ada