https://github.com/timfernix/skillchart
Make a shareable image that shows how you rate yourself by lane and by class in League.
https://github.com/timfernix/skillchart
classes lanes leagueoflegends lol ranks
Last synced: about 2 months ago
JSON representation
Make a shareable image that shows how you rate yourself by lane and by class in League.
- Host: GitHub
- URL: https://github.com/timfernix/skillchart
- Owner: timfernix
- Created: 2025-11-01T14:22:15.000Z (9 months ago)
- Default Branch: main
- Last Pushed: 2025-11-01T15:23:47.000Z (9 months ago)
- Last Synced: 2025-11-01T16:14:06.505Z (9 months ago)
- Topics: classes, lanes, leagueoflegends, lol, ranks
- Language: JavaScript
- Homepage: https://timfernix.github.io/skillchart/
- Size: 11.8 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# League of Legends Skill Chart - User Guide
Make a shareable image that shows how you rate yourself **by lane** and **by class** in League.
---
## Quick Start
1. **Open the page.**
You’ll see two lists: **Lanes** (Top, Jungle, Mid, Bot, Support, Fill) and **Classes** (Controller, Fighter, Mage, Marksman, Slayer, Tank, Specialist).
2. **(Optional) Enter a display name.**
Add your Riot ID (or any name) at the top. It appears as a sub-line in the exported image.
3. **Pick your ranks.**
Use the dropdown next to each lane/class. The big crest on the right updates instantly.
4. **Export or Copy.**
* **Export PNG** downloads a 1920×1080 image.
* **Copy to clipboard** places the image directly into your clipboard (supported browsers only).
5. **Share it.**
Post the image on X/Twitter, Discord, Reddit, etc.
---
## Helpful Bits
* **Randomize**: fills everything with random ranks (for fun or testing).
* **Reset**: sets everything back to Gold and clears the display name.
* **Tooltips on classes**: hover the small **i** to see a short description + example champions + link to the official wiki.
---
## Tips for Best Results
* Keep your browser at **100% zoom** before exporting for consistent rendering.
* Very long display names may wrap...shorter looks cleaner.
---
## FAQ
**Does the site store my name or ranks?**
No, everything is rendered client-side.
**Can I change the background?**
The exported image uses a fixed wallpaper to keep the style consistent.
**My clipboard copy doesn’t work. Why?**
Some browsers or system settings block clipboard writes. Use **Export PNG** instead.
**Can I use this on mobile?**
Yes, but desktop gives more space and the export is more reliable.
---
## Credits & Legal
* A fan-made tool by **timfernix**.
* “League of Legends” and related assets are owned by Riot Games. This project falls under Riot’s *Legal Jibber Jabber* policy and is not endorsed by Riot.