How to use these files

Each item is a zip containing the component sources and a short README inside. Expand the sections below for quick guides.

Using these files in VS Code
  1. Open this folder in VS Code: File → Open Folder....
  2. Install the Live Server extension to preview pages quickly.
  3. Right-click a zip file in the Explorer and choose "Reveal in File Explorer" then extract into your project folder.
  4. Import the component files or copy markup/styles into your project.
Using with AI (examples)

Use the snippets inside the zips as context for an AI assistant. Example prompt:

"I have a component called Badge Loader. Explain how to integrate its CSS and JS into an existing HTML page and provide a small usage example."

Or ask for code transformations, accessibility improvements, or test cases.

Using without AI (manual)

Open the extracted folder, read the bundled README.md, then copy the necessary files (CSS, JS, images) into your project and include them in your HTML:

<link rel="stylesheet" href="path/to/component.css">
<script src="path/to/component.js" defer></script>
Notes about where files are served from

This page links ZIPs from the repository Parts/ folder. If a download fails, check that the file exists in that folder or update the path in script.js.

Download remotely (PowerShell, curl, bash)

Files are expected to be available at https://webcomponents.snap-view.com/Parts/<filename>. Replace <filename> with the exact file name shown in the list.

PowerShell (Windows PowerShell 5.1)

Invoke-WebRequest -Uri "https://webcomponents.snap-view.com/Parts/<filename.zip>" -OutFile "<filename.zip>"
# Example
Invoke-WebRequest -Uri "https://webcomponents.snap-view.com/Parts/badgeloader.zip" -OutFile "badgeloader.zip"

curl (Linux, macOS, Windows)

curl -L -o <filename.zip> "https://webcomponents.snap-view.com/Parts/<filename.zip>"
# Example
curl -L -o badgeloader.zip "https://webcomponents.snap-view.com/Parts/badgeloader.zip"

wget / POSIX shell

wget -O <filename.zip> "https://webcomponents.snap-view.com/Parts/<filename.zip>"
# Example
wget -O badgeloader.zip "https://webcomponents.snap-view.com/Parts/badgeloader.zip"

Notes:

  • Use the exact file name and casing as stored in Parts/.
  • If downloads fail, ensure the hosting server exposes the /Parts/ directory and that files are readable (HTTP 200).
  • To make extracted scripts executable on Unix, run chmod +x <script-file> after extracting.