https://github.com/alexrogalskiy/quotes
📜 Styled Quotes API
https://github.com/alexrogalskiy/quotes
quotes quotes-api typescript vercel-serverless-functions
Last synced: about 2 months ago
JSON representation
📜 Styled Quotes API
- Host: GitHub
- URL: https://github.com/alexrogalskiy/quotes
- Owner: AlexRogalskiy
- License: gpl-3.0
- Created: 2021-01-31T23:13:42.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2026-04-23T22:32:43.000Z (about 2 months ago)
- Last Synced: 2026-04-24T00:25:19.613Z (about 2 months ago)
- Topics: quotes, quotes-api, typescript, vercel-serverless-functions
- Language: TypeScript
- Homepage: https://styled-quotes.vercel.app
- Size: 40.6 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1,474
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: .github/CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: .github/CODE_OF_CONDUCT.md
- Codeowners: .github/CODEOWNERS
- Security: SECURITY.md
- Support: .github/support.yml
- Dco: .github/DCO
- Cla: .github/CLA.md
Awesome Lists containing this project
README
# *Styled quotes*
> Generate SVG [styled quotes](https://en.wikipedia.org/wiki/Quote)
[](https://deepsource.io/gh/AlexRogalskiy/quotes/?ref=repository-badge)
[](https://deepscan.io/dashboard#view=project\&tid=11946\&pid=16317\&bid=347287)
[](https://github.com/XAMPPRocky/tokei)
[](https://houndci.com)
[](https://zenodo.org/badge/latestdoi/334777292)
[](https://david-dm.org/AlexRogalskiy/quotes)
[](https://david-dm.org/AlexRogalskiy/quotes?type=dev)
[](https://raw.githubusercontent.com/alexrogalskiy/quotes/master/LICENSE?token=AH44ZFH7IF2KSEDK7LSIW3C7YOFYC)
[](https://img.shields.io/github/issues/alexrogalskiy/quotes)
[](https://img.shields.io/github/forks/alexrogalskiy/quotes)
[](https://img.shields.io/github/stars/alexrogalskiy/quotes)
[](https://codeclimate.com/github/AlexRogalskiy/quotes/maintainability)
[](https://lgtm.com/projects/g/AlexRogalskiy/quotes/alerts/)
[](https://lgtm.com/projects/g/AlexRogalskiy/quotes/context:javascript)
[](https://app.codeac.io/github/AlexRogalskiy/quotes)
[](https://codebeat.co/projects/github-com-alexrogalskiy-quotes-master)
[](https://renovatebot.com/)
[](https://dependabot.com/)
[](https://newreleases.io/github/AlexRogalskiy/quotes)
[](https://hitsofcode.com/github/AlexRogalskiy/quotes/view)
[][tags]
[](https://codecov.io/gh/AlexRogalskiy/quotes)
[](https://github.com/AlexRogalskiy/quotes/actions/workflows/build.yml)
[](https://github.com/marketplace/actions/super-linter)
[](https://github.com/OrRosenblatt/validate-json-action)
[](https://bettercodehub.com/)
[](https://gitpod.io/#https://github.com/AlexRogalskiy/quotes)
[](https://github.com/AlexRogalskiy/quotes/discussions)
[](https://github.com/AlexRogalskiy/quotes/labels/question)
[](https://github.com/AlexRogalskiy/quotes/labels/bug)
## *Table of contents*
- [*Description*](#description)
- [*How to use*](#how-to-use)
- [*Example*](#example)
- [*Visitor stats*](#visitor-stats)
- [*Licensing*](#licensing)
- [*Authors*](#authors)
- [*Kubernetes*](#kubernetes)
- [*Versioning*](#versioning)
- [*Contribution*](#contribution)
- [*Acknowledgement*](#acknowledgement)
- [*Forks*](#forks)
- [*Issues*](#issues)
- [*Team Tools*](#team-tools)
- [*OpenGraph Card*](#opengraph-card)
- [*Development Support*](#development-support)
## *Description*
***Styled Quotes*** is a serverless function that generates dynamically styled quote images based on SVG (Scalable Vector Graphics).
For the tech stack, ***Styled Quotes*** using Typescript and serverless function from Vercel stack.
## *How to use*
It's simple, you can copy-aste this markdown content, like this one:
```
![Styled Quotes](https://styled-quotes.vercel.app/api?theme=[value]&layout=[value]&animation=[value]&bgColor=[value]&opacity=[value]&colorPattern=[value]"eColor=[value]&authorColor=[value]&pattern=[pattern]&category=[value]&width=[width]&height=[height]&keywords=[keywords])
```
There are several options you can use from the list:
| **Options** | **Description** | **Type** | **Example** | **Query Params** |
| ------------------------- | ---------------------------------- | --------------------------------- | ------------------ | ------------------------ |
| **\[Theme]** | Theme of the image | String | default_repocard | `?theme=[value]` |
| **\[Layout]** | Layout of the image | String | churchill | `&layout=[value]` |
| **\[Animation]** | Animation of the image | String | grow_out_in | `&animation=[value]` |
| **\[Background Color]** | Background color of the image | Hex color code | ffffff | `&bgColor=[value]` |
| **\[Opacity Pattern]** | Opacity of the background pattern | Float number | 0 - 1 | `&opacity=[value]` |
| **\[Color Pattern]** | Color of the background pattern | Hex color code | 1abc9c | `&colorPattern=[value]` |
| **\[Quote Font Color]** | Font color of the quote text | Hex color code | 000000 | `"eColor=[value]` |
| **\[Author Font Color]** | Font color of the author text | Hex color code | 000000 | `&authorColor=[value]` |
| **\[Pattern]** | Background pattern | String constant | plus | `&pattern=[value]` |
| **\[Category]** | Quote category | String constant | programming | `&category=[value]` |
| **\[Width]** | Image width | String | 100% | `&width=[value]` |
| **\[Height]** | Image height | String | 100% | `&height=[value]` |
| **\[Keywords]** | Quote keywords | String/String Array | love | `&keywords=[value]` |
Here is a list of supported image themes:
| **Name** | **Value** |
| --------------------------------- | ----------------------------- |
| **Default** | default |
| **Default repocard** | default_repocard |
| **Dark** | dark |
| **Radical** | radical |
| **Merko** | merko |
| **Gruvbox** | gruvbox |
| **Tokyo night** | tokyonight |
| **One dark** | onedark |
| **Cobalt** | cobalt |
| **Synth wave** | synthwave |
| **High contrast** | highcontrast |
| **Dracula** | dracula |
| **Prussian** | prussian |
| **Monokai** | monokai |
| **Vue** | vue |
| **Vue dark** | vue_dark |
| **Shades of purple** | shades_of_purple |
| **Night owl** | nightowl |
| **Buefy** | buefy |
| **Blue green** | blue_green |
| **Algolia** | algolia |
| **Great Gatsby** | great_gatsby |
| **Darcula** | darcula |
| **Bear** | bear |
| **Solarized dark** | solarized_dark |
| **Solarized light** | solarized_light |
| **Chartreuse dark** | chartreuse_dark |
| **Nord** | nord |
| **Gotham** | gotham |
| **Material pale night** | material_palenight |
| **Gray white** | graywhite |
| **Vision friendly dark** | vision_friendly_dark |
| **Ayu mirage** | ayu_mirage |
| **Midnight purple** | midnight_purple |
| **Calm** | calm |
| **Flag India** | flag_india |
| **Omni** | omni |
| **React** | react |
| **Jolly** | jolly |
| **Maroongold** | maroongold |
| **Yeblu** | yeblu |
| **Blueberry** | blueberry |
| **State orange** | slateorange |
| **Kacho ga** | kacho_ga |
| **Arabesque** | arabesque |
List of supported image layouts:
| **Name** | **Value** |
| --------------------------------- | ----------------------------- |
| **Default** | default |
| **Churchill** | churchill |
| **Pluto** | pluto |
| **Samuel** | samuel |
| **Socrates** | socrates |
| **Zues** | zues |
List of supported image animations:
| **Name** | **Value** |
| --------------------------------- | ----------------------------- |
| **Default** | default |
| **Grow-out-in** | grow_out_in |
List of categories supported by Quotes API:
| **Name** | **Value** |
| --------------------------------- | ----------------------------- |
| **General** | general |
| **Life** | life |
| **Love** | love |
| **Success** | success |
| **Motivation** | motivation |
| **Fun** | fun |
| **Movie** | movie |
| **Programming** | programming |
| **Entrepreneurship** | entrepreneurship |
| **Popular** | popular |
| **Humor** | humor |
| **Philosophy** | philosophy |
| **God** | god |
| **Inspire** | inspire |
| **Truth** | truth |
| **Wisdom** | wisdom |
| **Poetry** | poetry |
| **Romance** | romance |
| **Death** | death |
| **Happiness** | happiness |
| **Faith** | faith |
| **Hope** | hope |
| **Writing** | writing |
| **Religion** | religion |
| **Relationships** | relationships |
| **Spirituality** | spirituality |
| **Time** | time |
| **Knowledge** | knowledge |
| **Science** | science |
| **Social** | social |
| **Books** | books |
| **Health** | health |
| **Gratitude** | gratitude |
| **Courage** | courage |
| **Responsibility** | responsibility |
| **Anger** | anger |
| **Stress** | stress |
| **Sadness** | sadness |
| **Thinking** | thinking |
| **Travel** | travel |
| **French** | french |
| **Portuguese** | portuguese |
Patterns in Quotes are provided by [Hero Pattern](https://github.com/lowmess/hero-patterns) package which is developed by [Lowmess](https://github.com/lowmess/):
| **Name** | **Value** |
| --------------------------------- | ----------------------------- |
| **Jigsaw** | jigsaw |
| **Overcast** | overcast |
| **Formal Invitation** | formalInvitation |
| **Topography** | topography |
| **Texture** | texture |
| **Jupiter** | jupiter |
| **Architect** | architect |
| **Cutout** | cutout |
| **Hideout** | hideout |
| **Graph Paper** | graphPaper |
| **Yyy** | yyy |
| **Squares** | squares |
| **Falling Triangles** | fallingTriangles |
| **Piano Man** | pianoMan |
| **Pie Factory** | pieFactory |
| **Dominos** | dominos |
| **Hexagons** | hexagons |
| **Charlie Brown** | charlieBrown |
| **Autumn** | autumn |
| **Temple** | temple |
| **Stamp Collection** | stampCollection |
| **Death Star** | deathStar |
| **Church on Sunday** | churchOnSunday |
| **I Like Food** | iLikeFood |
| **Overlapping Hexagons** | overlappingHexagons |
| **Four Point Stars** | fourPointStars |
| **Bamboo** | bamboo |
| **Bathroom Floor** | bathroomFloor |
| **CorkScrew** | corkScrew |
| **Happy Intersection** | happyIntersection |
| **Kiwi** | kiwi |
| **Lisbon** | lisbon |
| **Random Shapes** | randomShapes |
| **Steel Beams** | steelBeams |
| **Tiny Checkers** | tinyCheckers |
| **X Equals** | xEquals |
| **Anchors Away** | anchorsAway |
| **Bevel Circle** | bevelCircle |
| **Brick Wall** | brickWall |
| **Fancy Rectangles** | fancyRectangles |
| **Heavy Rain** | heavyRain |
| **Overlapping Circles** | overlappingCircles |
| **Plus** | plus |
| **Rounded Plus Connected** | roundedPlusConnected |
| **Volcano Lamp** | volcanoLamp |
| **Wiggle** | wiggle |
| **Bubbles** | bubbles |
| **Cage** | cage |
| **Connections** | connections |
| **Current** | current |
| **Diagonal Stripes** | diagonalStripes |
| **Flipped Diamonds** | flippedDiamonds |
| **Floating Cogs** | floatingCogs |
| **Glamorous** | glamorous |
| **Hounds tooth** | houndstooth |
| **Leaf** | leaf |
| **Lines In Motion** | linesInMotion |
| **Moroccan** | moroccan |
| **Morphing Diamonds** | morphingDiamonds |
| **Rails** | rails |
| **Rain** | rain |
| **Skulls** | skulls |
| **Squares In Squares** | squaresInSquares |
| **Stripes** | stripes |
| **Tic Tac Toe** | ticTacToe |
| **ZigZag** | zigZag |
| **Aztec** | aztec |
| **BankNote** | bankNote |
| **Boxes** | boxes |
| **Circles And Squares** | circlesAndSquares |
| **CircuitBoard** | circuitBoard |
| **Curtain** | curtain |
| **Diagonal Lines** | diagonalLines |
| **Endless Clouds** | endlessClouds |
| **Eyes** | eyes |
| **Floor Tile** | floorTile |
| **Groovy** | groovy |
| **Intersecting Circles** | intersectingCircles |
| **Melt** | melt |
| **Overlapping Diamonds** | overlappingDiamonds |
| **Parkay Floor** | parkayFloor |
| **Pixel Dots** | pixelDots |
| **Polka Dots** | polkaDots |
| **Signal** | signal |
| **Slanted** Stars | slantedStars |
| **Wallpaper** | wallpaper |
## *Example*
These are examples of using ***Styled Quotes***:
```
```
```
```
```
```
```
```
```
```
```
```
```
```
## *CI/CD*
[](https://www.plantuml.com/plantuml/png/ZP1BRzD04CVFxAUObekH7AzuWAeUK5lRGcrI6-9QubQvzZGnMU-QVG0HuhipVYH685Jl8HdF_pUF_rmOMsZh6i5EAdoi9KAuIlCe_P3dwnLihMtDEUUw-1viQhjr3ywWBfMqA6rGgeQNGhbARHnlHI6xFej3Pc5QNLiql2cCHSrEQbaALw7JuiyPdBeqIWOjrVwNwVeP_WNbhfPc3chAPXQcPA6_kWUS0qlyuPuORfKIXk_EPc6LAdUe1v8bga8u3Qzv645SAhCt5fjJ-CcUTKNtDt6ol4uoRpo13pT3y0AUF_PlvBBmrYFlFb2mk2raiK7zDvF4d_FCwztuIVSx0J2-kpHTtKTfk8pNth2c7_L__wB3s3IvN7_AhsBlU55QuH1EHRyOwrilppAFhkJ3acGjqQAP87PPMgKXmcyeL8kQiMC8Y_T0zk0SNWRmqPajewykETw5X5S1tEbwGxxP8KdwSIqYNa_4b2PcC4h0cm2kN2qgDcP8wwz5qji0CbeEfzuaaXEItWMqSYlKdbsWh5mZVWC0)
## *Visitor stats*
[](https://hits.seeyoufarm.com)
## *Licensing*
***Styled Quotes*** is distributed under LGPL version 3 or later, \[[License](https://github.com/AlexRogalskiy/quotes/blob/master/LICENSE)].
LGPLv3 is additional permissions on top of GPLv3.
## *Authors*
***Styled Quotes*** is maintained by the following GitHub team-members:
- [](https://github.com/AlexRogalskiy)
with community support please contact with us if you have some question or proposition.
## *Kubernetes*
Running k8s cluster with tilt command by acquiring k8s deployment configuration:
```shell
tilt up
```
Shutting down k8s cluster with provisioned resources removal:
```shell
tilt down --delete-namespaces
```
## *Versioning*
The project uses [SemVer](http://semver.org/) for versioning. For the versions available, see the [tags on this repository][tags].
## *Contribution*
[](https://badges.pufler.dev)
Please read
[CONTRIBUTING.md](https://github.com/AlexRogalskiy/quotes/blob/master/.github/CONTRIBUTING.md)
for details on our code of conduct, and the process for submitting pull requests to us ([emoji key](https://allcontributors.org/docs/en/emoji-key)).
This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind are welcome!
[](http://makeapullrequest.com)
See also the list of [contributors][contributors] who participated in this project.
## *Acknowledgement*
[][stars]
[][stars_chart]
[][stats_chart]
## *Forks*
[][forkers]
## *Issues*
[](https://issuehunt.io/r/AlexRogalskiy/quotes)
## *Team Tools*
[](https://www.jetbrains.com/)
***Styled Quotes*** Team would like inform that JetBrains is helping by provided IDE to develop the application. Thanks to its support program for an Open Source projects!
[](https://gitpod.io/#https://github.com/AlexRogalskiy/quotes)
***Styled Quotes*** has experimental support for Gitpod, a pre-configured development environment that runs in your browser. To use Gitpod, click the button below and sign in with GitHub. Gitpod also offers a browser add-on, though it is not required.
[](https://lunrjs.com/guides/getting_started.html)
***Styled Quotes*** project is using Lunr search tool to index and query text data by keywords.
## *OpenGraph Card*
## *Development Support*
Like ***Styled Quotes*** ? Consider buying me a coffee :)
[](https://www.patreon.com/alexrogalskiy)
[](https://www.buymeacoffee.com/AlexRogalskiy)
[](https://ko-fi.com/alexrogalskiy)
***
[](https://www.typescriptlang.org/)
[](https://vercel.com/)
[](https://forthebadge.com/)
[repo]: https://github.com/AlexRogalskiy/quotes
[tags]: https://github.com/AlexRogalskiy/quotes/tags
[issues]: https://github.com/AlexRogalskiy/quotes/issues
[pulls]: https://github.com/AlexRogalskiy/quotes/pulls
[wiki]: https://github.com/AlexRogalskiy/quotes/wiki
[stars]: https://github.com/AlexRogalskiy/quotes/stargazers
[stars_chart]: https://starchart.cc/AlexRogalskiy/quotes
[stats_chart]: https://cauldron.io/project/5116
[forkers]: https://github.com/AlexRogalskiy/quotes/network/members
[contributors]: https://github.com/AlexRogalskiy/quotes/graphs/contributors