https://github.com/NNTin/discord-logo

animated discord logo in svg
https://github.com/NNTin/discord-logo

discord discord-logo hacktoberfest logo svg

Last synced: 8 months ago
JSON representation

animated discord logo in svg

• Host: GitHub
• URL: https://github.com/NNTin/discord-logo
• Owner: NNTin
• License: mit
• Created: 2017-11-24T00:33:48.000Z (about 8 years ago)
• Default Branch: master
• Last Pushed: 2023-03-01T11:10:33.000Z (almost 3 years ago)
• Last Synced: 2025-04-21T14:02:40.950Z (8 months ago)
• Topics: discord, discord-logo, hacktoberfest, logo, svg
• Language: Vue
• Homepage: https://nntin.github.io/discord-logo/
• Size: 2.7 MB
• Stars: 65
• Watchers: 1
• Forks: 19
• Open Issues: 16
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-vue - discord-logo - A Vue.js animated discord logo generator based on SVGs. ([Github Page](https://nntin.github.io/discord-logo/)) (Projects Using Vue.js / Open Source)
• awesome-vue - discord-logo - animated discord logo in svg ` 📝 6 days ago ` (Open Source [🔝](#readme))
• awesome-vue-zh - 不和谐,标志 - 基于SVG的Vue.js动画不和谐徽标生成器. ([Github Page](https://nntin.github.io/discord-logo/)) (awesome-vue [](https://github.com/sindresorhus/awesome) / 开源)
• awesome-vue - discord-logo ★21 - A Vue.js animated discord logo generator based on SVGs. ([Github Page](https://nntin.github.io/discord-logo/)) (Awesome Vue.js [ ★101652](https://github.com/sindresorhus/awesome) / Open Source)
• awesome-vue - discord-logo - A Vue.js animated discord logo generator based on SVGs. ([Github Page](https://nntin.github.io/discord-logo/)) (Awesome Vue.js [](https://github.com/sindresorhus/awesome) / Open Source)
• awesome-systools - discord-logo

README

          
# Animated Discord Logo

[![Linting CI Actions Status](https://github.com/NNTin/discord-logo/workflows/Linting%20CI/badge.svg)](https://github.com/NNTin/discord-logo/actions)

This project was inspired by [Discord's loading logo](https://canary.discordapp.com/assets/0bdc0497eb3a19e66f2b1e3d5741634c.webm).

Since the loading logo is a video you have less control over its behavior. This project recreates the animated logo in **S**caleable **V**ector **G**raphics. By using **SVG**, all edges are clean and sharp. You can have any size and color. It consumes less resources compared to a video. Original SVG and color palette were retrieved from [Discord](https://discordapp.com/branding).

If you need help, feel free joining [my server](https://discord.gg/gDHs8AV). Visit my [GitHub page](https://nntin.github.io/discord-logo/) to create your own animated Discord logo.

## Preview Example

![](https://cdn.rawgit.com/NNTin/discord-logo/f4333344/src/assets/animateddiscord.svg)

## Build Setup

``` bash

# install dependencies

npm install

# serve with hot reload at localhost:8080

npm run dev

```

## License/Acknowledgements

This project is neither built nor endorsed by Discord.

Github corner template: [tholman](https://github.com/tholman/github-corners)

Various backgrounds: [cantelope](https://cantelope.ml/), [GitHub](https://github.com/srmcgann)

[The MIT License](https://github.com/NNTin/discord-logo/blob/master/LICENSE)