newshields Svelte Themes

Newshields

🛡️ Generate beautiful badges for your GitHub READMEs. Built with SvelteKit & Hono.

New Shields Hero

Explore  ✦  Badge Builder  ✦  API Docs  ✦  Stack  ✦  Getting Started  ✦  License

SvelteKit TypeScript Vercel Hono Upstash GitHub stars GitHub forks GitHub issues

✨ Features

  • 🎨 8 Curated Themes — Aurora, Sunset, Midnight, Forest, Ocean, Ember, Graphite, Plasma — each gradient hand-tuned for dark READMEs
  • ⚡ Edge-Rendered — Fresh SVG render on Vercel's edge under 40ms
  • 🔍 SVGL Icons — Integrated with 3000+ tech icons from SVGL
  • 🛠️ Live Builder — Reactive editor with theme swatches and one-click Markdown copy
  • 🔌 Open API — Single GET endpoint, any param combo, validated and rate-limited
  • ♿ Accessible — Semantic SVG with proper ARIA labels
  • 📱 Responsive — Glassmorphic design that works everywhere

🛠️ Stack

🚀 Getting Started

[!IMPORTANT] Quick usage: You can start using badges immediately without setting up the project! Just visit newshields.vercel.app/create to generate your custom badges and copy the Markdown.

To run the project locally and customize it, follow the steps below.

You will need:

  1. Fork this repository and clone it locally:
git clone [email protected]:your_username/newshields.git
  1. Install dependencies:
pnpm install
  1. Run the development server:
pnpm dev
  1. Open http://localhost:3000 in your browser.

📦 Deployment

Deploy to Vercel:

pnpm build

Or use the Vercel CLI:

vercel --prod

🔌 API Usage

Endpoint

GET /api/badge.svg?label={label}&title={title}&icon={icon}&theme={theme}

Parameters

Param Description Example
label Left side text Powered+by
title Right side text Svelte+5
icon Icon ID from SVGL svelte, react, typescript
theme Color theme sunset, ocean, midnight

Example

![Powered by Svelte](https://newshields.vercel.app/api/badge.svg?label=Powered+by&title=Svelte&icon=svelte&theme=sunset)

Available Themes

Theme Preview
aurora Green-purple gradient
sunset Orange-pink gradient
midnight Deep blue-purple
forest Emerald gradient
ocean Cyan-blue gradient
ember Red-orange gradient
graphite Gray neutral
plasma Purple-pink glow

🔑 License

MIT © 2026 Kevin Cheni


Get Start

Top categories

Loading Svelte Themes