svgl/README.md

Discover  ⁘  Submit logo  ⁘  Stack  ⁘  Contributing

🛠️ Stack

• Sveltekit - Web development, streamlined.
• Typescript - JavaScript with syntax for types.
• Tailwindcss - A utility-first CSS framework for rapidly building custom designs.
• Prettier + prettier-plugin-tailwindcss - An opinionated code formatter.
• phosphor-svelte - A clean and friendly icon family for Svelte.
• svelte-sonner - An opinionated toast component for Svelte.
• Vitest - Blazing Fast Unit Test Framework.

🚀 Getting Started

You will need:

• Node.js 16+ (recommended 18 LTS).
• Git.

1. Clone or fork this repository:

git clone git@github.com:pheralb/svgl.git

2. Install dependencies with your favorite package manager:

# with npm:
npm install

# with pnpm:
pnpm install

# with ultra:
ultra install

# with yarn:
yarn install

3. Go to the static/library folder and add your .svg logo. Remember to optimize SVG for web use, you can use SVGOMG.

Warning

The size limit for each .svg is 20kb.

4. Go to the src/data/svgs.ts and add the information about your logo, following the structure:

{
  "title": "Title",
  "category": "Category",
  "route": "/library/your_logo.svg",
  "url": "Website"
},

or to support a different logo for light and dark themes:

{
  "title": "Title",
  "category": "Category",
  "route": {
    "light": "/library/your_logo_light.svg",
    "dark": "/library/your_logo_dark.svg"
  },
  "url": "Website"
},

And create a pull request with your logo 🚀.

✌️ Contributing

🔑 License

• MIT.