loading...
Cover image for GitHub Profile README : Animated Dynamic Quote Generator

GitHub Profile README : Animated Dynamic Quote Generator

imshravan profile image Shravan Kumar B ・Updated on ・2 min read

As everyone must be aware of the feature launched by GitHub around 6 months back called Github Profile README, where GitHub allows you to create a special profile for adding simple developer portfolio based on your creativity.


Alt Text

Inspired by @anuragharza


This article is about the release of v1.0 of the github-readme-quotes.

GitHub Dynamic Quote Generator

GitHub Dynamic Quote Generator simply allows you add an image link in the markdown (README.md) and it will show you dynamic quote for every user visiting your GitHub account.

Example Post:

 Example Post

Features

  • Quotes Layout
  • Quotes Design
  • Quotes Animation
  • Quotes Themes
  • Customization



Live Demo:

Default Theme:

Quote

Dark Theme:
Quote

There are more themes you can explore in the repo

Default Animated Dark Theme:

Quote

Socrates Layout:

Quote

Stack

Stack / Platform Used
Node.js
Express.js
Heroku

Deployed Link : https://github-readme-quotes.herokuapp.com/quote

GitHub Link : https://github.com/shravan20/github-readme-quotes

GitHub logo shravan20 / github-readme-quotes

Dynamic quote generator for your GitHub readmes

github-readme-quotes

Dynamic quote generator for your GitHub readmes

banner

alt PRs Welcome Open Source? Yes! GitHub contributors Pull Request Counts last commit deployment-status



Note: To read an article on this project, please refer GitHub Profile README : Animated Dynamic Quote Generator


Github Readme Quotes

Copy and paste the following markdown content to display the quote.

![Quote](https://github-readme-quotes.herokuapp.com/quote)
Enter fullscreen mode Exit fullscreen mode


  • Themes

You can display your quote in different themes without any manual customization.

Use ?theme=THEME_NAME parameter as shown below.

![Quote](https://github-readme-quotes.herokuapp.com/quote?theme=dark)
Enter fullscreen mode Exit fullscreen mode

Available Themes

dark, radical, merko, gruvbox, tokyonight, onedark, cobalt, synthwave, highcontrast, dracula

Gotham

Quote

Dark

Quote

Light Theme

Quote

You can explore different themes here.

Feel free to contribute different themes.


  • Layouts

You can also change the layout of your templates.

Use ?layout=LAYOUT parameter as shown below

![Quote](https://github-readme-quotes.herokuapp.com/quote?theme=dark&layout=socrates)
Enter fullscreen mode Exit fullscreen mode

Layout 1 (Default)

Quote

Layout 2 (Socrates)

Quote

You can explore different layouts here.

Feel free to contribute different layouts.


  • Animations

You can also add animations to your templates.

Use…




Check out the docs to learn more

We hope you guys liked the project. And make
sure to give it a star on GitHub.

Featured on Twitter:

Discussion

pic
Editor guide
Collapse
whyshali profile image
whyshali

Good one