Home
Softono
github-widgetbox

github-widgetbox

Open source MIT TypeScript
Website GitHub
332
Stars
40
Forks
10
Issues
5
Watchers
2 years
Last Commit
Web Components & Widgets Utilities & System

About github-widgetbox

github-widgetbox provides beautiful, dynamic widgets designed to enhance GitHub profile README pages. It allows developers to visually showcase their technical expertise by displaying statistics and skills in a clean, organized format. The tool supports a wide variety of content categories including programming languages, development frameworks, software libraries, and essential developer tools. Users can customize these widgets to include specific items from an extensive list of options such as JavaScript, Python, React, Docker, AWS, and many others. The widgets can be configured to either display logos alone or include text labels alongside them for clarity. To implement these features, users simply copy a generated markdown link containing their chosen parameters and paste it directly into their GitHub README file. This solution offers a straightforward way to create a professional profile presence without manual coding of complex visual elements, making it ideal for developers who want to highlight their

Platforms

Web Self-hosted

Languages

TypeScript

Links

Website Source Code
j
Published by
jurredr
Visit View Profile

README.md

View on GitHub

image

[✨] Beautiful, dynamic widgets for GitHub Readme pages. (Statistics, Skills, etc.)



Widgets

Skills

A clear way to give an overview of programming languages, tools, and software that you're familiar with.

Languages

Default &includeNames=true
GitHub WidgetBox GitHub WidgetBox 
[![GitHub WidgetBox](https://github-widgetbox.vercel.app/api/skills?languages=js,ts,java,php,python,html,css,c,cpp,csharp,swift,rust,ruby,kotlin,erlang,dart,go,scala,elm,bash,r,xml,json,yaml,postgresql,mysql,haskell,powershell,lua,visualbasic,x86,arm,groovy,perl,solidity,fortran,sass,graphql,clojure,clojurescript,markdown)](https://github.com/Jurredr/github-widgetbox)

Frameworks

Default &includeNames=true
GitHub WidgetBox GitHub WidgetBox 
[![GitHub WidgetBox](https://github-widgetbox.vercel.app/api/skills?frameworks=vue,react,nuxt,next,django,flutter,electron,bootstrap,gatsby,nest,tailwind,windi,express,svelte,angular,dotnetcore,laravel,ionic,dotnet)](https://github.com/Jurredr/github-widgetbox)

Libraries

Default &includeNames=true
GitHub WidgetBox GitHub WidgetBox 
[![GitHub WidgetBox](https://github-widgetbox.vercel.app/api/skills?libraries=babel,p5,tensorflow,jquery)](https://github.com/Jurredr/github-widgetbox)

Tools

Default &includeNames=true
GitHub WidgetBox GitHub WidgetBox 
[![GitHub WidgetBox](https://github-widgetbox.vercel.app/api/skills?tools=git,docker,npm,yarn,webpack,gulp,firebase,mongodb,wordpress,shopify,woocommerce,vercel,redis,nodejs,heroku,apache,nginx,aws,jupyter,gradle,prettier)](https://github.com/Jurredr/github-widgetbox)

Software & IDE's

Default &includeNames=true
GitHub WidgetBox GitHub WidgetBox 
[![GitHub WidgetBox](https://github-widgetbox.vercel.app/api/skills?software=linux,windows,vscode)](https://github.com/Jurredr/github-widgetbox)



Profile

Show off your profile with some interesting statistics. Perfect for profile READMEs.

&data=followers,repositories,stars,commits
GitHub WidgetBox

[![GitHub WidgetBox](https://github-widgetbox.vercel.app/api/profile?username=Jurredr&data=followers,repositories,stars,commits)](https://github.com/Jurredr/github-widgetbox)



Themes

GitHub WidgetBox supports a great variety of different themes for all widgets, like the ones below. You can check out more examples in themes.md, or have a look at all themes in the themes.ts file. Feel free to create your own theme(s) and add them to that themes.ts file. Make sure to create a PR afterwards to share it with everyone else!

&theme=darkmode

darkmode default
GitHub WidgetBox GitHub WidgetBox
viridescent carbon
GitHub WidgetBox GitHub WidgetBox
nautilus serika
GitHub WidgetBox GitHub WidgetBox 
[![GitHub WidgetBox](https://github-widgetbox.vercel.app/api/profile?username=Jurredr&data=followers,repositories,stars,commits&theme=nautilus)](https://github.com/Jurredr/github-widgetbox)



TO-DO

  • [x] Fix skills text being off-center
  • [x] Add themes (dark mode)
  • [x] Add Skills: Tools & Frameworks widget
  • [x] Add Skills: Software & IDEs widget
  • [ ] Make autobuilder instead of manual build and push
  • [ ] Count organization repositories (+ their stars)
  • [ ] Truncate name if too long on profile widget
  • [ ] Make all widgets a modular size
  • [ ] Add Profile Tag widget
  • [ ] Add Skill Tag widget
  • [ ] Add Commit Streak widget
  • [ ] Add Twitter widget
  • [ ] Add LinkedIn widget
  • [ ] Add Instagram widget
  • [ ] Add YouTube widget
  • [ ] Add Portfolio website widget
  • [ ] Add Project link widget
  • [ ] Add Profile banner widget
  • [ ] Add Stats widget