HuyHieu - Minimalistic Badge Service

A simple, flat, and minimalistic badge generator that can embed a website's favicon and custom text. Built with Hono and Deno.

This service is hosted on ValTown for instant, serverless deployment and sharing.

Features

  • Flat, modern SVG badges
  • Embeds a website's favicon (ICO)
  • Customizable label and value text
  • Three badge sizes: small, medium, large
  • Customizable border radius (default: 0)
  • Parallelogram shape support
  • VS Code Marketplace integration

HuyHieu API

/huyhieu?url=<website>&label=<label>&value=<value>&color=<color>&textcolor=<textcolor>&size=<size>&radius=<radius>&shape=<shape>
  • url (optional): Website to fetch favicon from
  • label (optional): Left text (default: 'huy' if both label and value are missing)
  • value (optional): Right text (default: 'hieu' if both label and value are missing)
  • color (optional): Right background color (default: green, supports hex codes)
  • textcolor (optional): Right text color (default: white, supports hex codes)
  • size (optional): Badge size (small, medium, large, default: small)
  • radius (optional): Border radius in px (default: 0, only for rect)
  • shape (optional): Badge shape (rect, parallelogram, etc.; default: rect)

Examples

  • Only favicon: /huyhieu?url=github.com Example badge
  • Favicon + label: /huyhieu?url=github.com&label=GitHub Example badge
  • Favicon + value: /huyhieu?url=github.com&value=Text Example badge
  • Favicon + both: /huyhieu?url=github.com&label=GitHub&value=Text Example badge
  • Custom color: /huyhieu?url=github.com&label=GitHub&value=Text&color=blue&textcolor=cyan Example badge
  • Small size: /huyhieu?url=github.com&label=GitHub&value=Text&size=small Small badge
  • Large size: /huyhieu?url=github.com&label=GitHub&value=Text&size=large Large badge
  • Custom border radius: /huyhieu?url=github.com&label=GitHub&value=Text&radius=10 Radius badge
  • Parallelogram shape: /huyhieu?url=github.com&label=GitHub&value=Text&shape=parallelogram Parallelogram badge
  • Default (no params): /huyhieu → shows 'huy hieu' Example badge

VS Marketplace

/huyhieu/vsmarketplace/<statType>/<namespace>?label=<true|false>&color=<color>&size=<size>&shape=<shape>

Parameters

  • statType: The type of statistic to display
    • download / install - Total installations (173M)
    • rating - Average rating (4.2)
  • namespace: Extension identifier (e.g., ms-python.python)
  • label (optional): Show label text (default: true)
  • color, size, shape, etc.: Same styling options as regular badges

VS Marketplace Examples

  • Downloads: /huyhieu/vsmarketplace/download/ms-python.python Downloads
  • Installs: /huyhieu/vsmarketplace/install/ms-python.python install
  • Rating: /huyhieu/vsmarketplace/rating/ms-python.python Rating
  • No Label: /huyhieu/vsmarketplace/download/ms-python.python?label=false No Label
  • Custom Style: /huyhieu/vsmarketplace/download/ms-python.python?color=purple&shape=parallelogram Custom

Development

Notes

If you use Deno and ValTown for the first time, you may need to add it to your PATH:

# Set deno to path set PATH=%PATH%;%USERPROFILE%\.deno\bin # Install vt deno install -grAf jsr:@valtown/vt # Run in local deno run --allow-net main.js