Getting Started

Basic Usage

To display icons in your README, use the following markdown:

[![My Skills](https://techbadges.santosr.xyz/icons?i=js,html,css,wasm)](https://techbadges.santosr.xyz)

Result:

Parameters

Parameter	Description	Default	Example
`i` or `icons`	Comma-separated list of icon names	Required	`i=js,ts,react`
`t` or `theme`	Icon theme (`dark` or `light`)	`dark`	`theme=light`
`perline`	Number of icons per row (1-50)	`15`	`perline=8`

Themed Icons

Many icons have dark and light variants. The theme affects the background color:

Dark Theme (default):

[![My Skills](https://techbadges.santosr.xyz/icons?i=github,vscode,docker&theme=dark)](https://techbadges.santosr.xyz)

Light Theme:

[![My Skills](https://techbadges.santosr.xyz/icons?i=github,vscode,docker&theme=light)](https://techbadges.santosr.xyz)

Icons Per Line

Control the number of icons displayed per row:

[![My Skills](https://techbadges.santosr.xyz/icons?i=js,ts,react,vue,angular,svelte&perline=3)](https://techbadges.santosr.xyz)

Centering Icons

To center icons in your README:

<p align="center">
  <a href="https://techbadges.santosr.xyz">
    <img src="https://techbadges.santosr.xyz/icons?i=git,kubernetes,docker,aws,gcp" />
  </a>
</p>

Icon Aliases

Some icons have short aliases for convenience:

Alias	Full Name
`js`	`javascript`
`ts`	`typescript`
`py`	`python`
`md`	`markdown`
`postgres`	`postgresql`
`go`	`golang`

Examples

Full Stack Developer

[![My Skills](https://techbadges.santosr.xyz/icons?i=react,nodejs,typescript,postgresql,docker,aws&perline=6)](https://techbadges.santosr.xyz)

DevOps Engineer

[![My Skills](https://techbadges.santosr.xyz/icons?i=kubernetes,docker,terraform,ansible,jenkins,prometheus&perline=6)](https://techbadges.santosr.xyz)

Data Scientist

[![My Skills](https://techbadges.santosr.xyz/icons?i=python,pytorch,tensorflow,jupyter,pandas,numpy&perline=6)](https://techbadges.santosr.xyz)

Next Steps

Browse all available icons
Check the API reference for advanced usage
Contribute to the project