> ## Documentation Index
> Fetch the complete documentation index at: https://icons.mzrdev.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Contribution Snakes

> Turn your GitHub contribution graph into a fun snake animation.

## Overview

Contribution Snakes generates an animated SVG where a snake "eats" your GitHub contributions.

## Visual Examples

### Palette Showcase

Select a palette to match your GitHub profile theme.

<Tabs>
  <Tab title="Dark Theme (Default)">
    ```markdown theme={null}
    ![](https://icon.mzrdev.com/snk?username=MZRCode&palette=github-dark)
    ```

    <Frame>
      <img src="https://icon.mzrdev.com/snk?username=MZRCode&palette=github-dark" alt="Dark Snake" />
    </Frame>
  </Tab>

  <Tab title="Light Theme">
    ```markdown theme={null}
    ![](https://icon.mzrdev.com/snk?username=MZRCode&palette=github-light)
    ```

    <Frame>
      <img src="https://icon.mzrdev.com/snk?username=MZRCode&palette=github-light" alt="Light Snake" />
    </Frame>
  </Tab>

  <Tab title="Ocean Theme">
    ```markdown theme={null}
    ![](https://icon.mzrdev.com/snk?username=MZRCode&palette=ocean)
    ```

    <Frame>
      <img src="https://icon.mzrdev.com/snk?username=MZRCode&palette=ocean" alt="Ocean Snake" />
    </Frame>
  </Tab>
</Tabs>

### Advanced Customization

You can override colors and toggle UI elements for a unique look.

<Tabs>
  <Tab title="Custom Colors">
    ```markdown theme={null}
    ![](https://icon.mzrdev.com/snk?username=MZRCode&color_snake=ff0000&color_dots=f0f0f0,d1d1d1,a1a1a1,717171,414141)
    ```

    <Frame>
      <img src="https://icon.mzrdev.com/snk?username=MZRCode&color_snake=ff0000&color_dots=f0f0f0,d1d1d1,a1a1a1,717171,414141" alt="Custom Colors" />
    </Frame>
  </Tab>

  <Tab title="Show Score">
    ```markdown theme={null}
    ![](https://icon.mzrdev.com/snk?username=MZRCode&show_score=true)
    ```

    <Frame>
      <img src="https://icon.mzrdev.com/snk?username=MZRCode&show_score=true" alt="With Score" />
    </Frame>
  </Tab>

  <Tab title="Minimal (No Bar)">
    ```markdown theme={null}
    ![](https://icon.mzrdev.com/snk?username=MZRCode&show_bar=false)
    ```

    <Frame>
      <img src="https://icon.mzrdev.com/snk?username=MZRCode&show_bar=false" alt="Minimal Snake" />
    </Frame>
  </Tab>
</Tabs>

### Animation Speed

Select a speed level to see how fast the snake moves.

<Tabs>
  <Tab title="Slow (1)">
    ```markdown theme={null}
    ![](https://icon.mzrdev.com/snk?username=MZRCode&speed=1)
    ```

    <Frame>
      <img src="https://icon.mzrdev.com/snk?username=MZRCode&speed=1" alt="Slow Snake" />
    </Frame>
  </Tab>

  <Tab title="Normal (2)">
    ```markdown theme={null}
    ![](https://icon.mzrdev.com/snk?username=MZRCode&speed=2)
    ```

    <Frame>
      <img src="https://icon.mzrdev.com/snk?username=MZRCode&speed=2" alt="Normal Snake" />
    </Frame>
  </Tab>

  <Tab title="Fast (3)">
    ```markdown theme={null}
    ![](https://icon.mzrdev.com/snk?username=MZRCode&speed=3)
    ```

    <Frame>
      <img src="https://icon.mzrdev.com/snk?username=MZRCode&speed=3" alt="Fast Snake" />
    </Frame>
  </Tab>
</Tabs>

## Customization Options

| Parameter     | Description                                     | Default       |
| :------------ | :---------------------------------------------- | :------------ |
| `palette`     | `github-dark`, `github-light`, `ocean`          | `github-dark` |
| `color_snake` | Custom color for the snake (hex)                | Derived       |
| `color_dots`  | Comma-separated list of 5 colors for dots (hex) | Derived       |
| `show_bar`    | Show the bottom status bar                      | `true`        |
| `show_score`  | Show the "eaten" score                          | `false`       |
| `speed`       | Animation speed (1-3)                           | `1`           |