# UsageLearn how to use Thulite SVG in content and templates, from placement and rendering to accessibility and styling for consistent, production-ready icons.
Use Thulite SVG to place, render, and style SVGs and icons in content and templates.

## Placement

Start by placing SVGs and icons in locations that Thulite can resolve.

{{< link-card
  title="Placement"
  description="Place your SVG files and icons where Thulite can find them."
  href="/docs/basics/placement/"
>}}

## Add to content

Render SVGs and icons in Markdown content with the `inline-svg` shortcode.

{{< card-grid >}}
{{< link-card
  title="SVGs"
  description="Embed SVG files directly in your Markdown content."
  href="/docs/basics/shortcode/svgs/"
>}}
{{< link-card
  title="Icons"
  description="Insert icon symbols inline with a simple shortcode."
  href="/docs/basics/shortcode/icons/"
>}}
{{< /card-grid >}}

## Add to templates

Render SVGs and icons in templates with the `inline-svg` partial.

{{< card-grid >}}
{{< link-card
  title="SVGs"
  description="Render SVG files in templates with the inline-svg partial."
  href="/docs/basics/partial/svgs/"
>}}
{{< link-card
  title="Icons"
  description="Render icons in templates with the inline-svg partial."
  href="/docs/basics/partial/icons/"
>}}
{{< /card-grid >}}

## Accessibility

Make SVGs and icons accessible with clear labels and sensible defaults.

{{< link-card
  title="Accessibility"
  description="Make every SVG and icon clear, readable, and accessible."
  href="/docs/basics/accessibility/"
>}}

## Styling

Adjust size, color, and alignment so SVGs and icons match your design.

{{< link-card
  title="Styling"
  description="Style SVGs and icons to match your site design."
  href="/docs/basics/styling/"
>}}