- 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.
You will need:
- Clone or fork this repository:
git clone [email protected]:pheralb/svgl.git- Install dependencies with your favorite package manager:
# with npm:
npm install
# with pnpm:
pnpm install
# with ultra:
ultra install
# with yarn:
yarn install-
Go to the
static/libraryfolder and add your.svglogo. Remember to optimize SVG for web use, you can use SVGOMG. -
Go to the
src/data/svgs.tsand add the information about your logo, following the structure:
Important
To avoid conflicts with other svgs IDs, generate a short random number for the id: Generate (only check 'include numbers').
{
"id": 45248,
"title": "Title",
"category": "Category",
"route": "/library/your_logo.svg",
"url": "Website"
},or to support a different logo for light and dark themes:
{
"id": 45248,
"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 🚀.
- MIT.