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

# TDS Calculator

> Calculate TDS amounts and applicable rates for resident and non-resident payments.

export const Iframe = ({lightUrl, darkUrl, title, height = 900, className = ""}) => {
  const resolvedHeight = typeof height === "number" ? `${height}px` : height;
  return <div className="w-full overflow-hidden">
      {}
      <div className="w-full">
        {}
        <iframe src={lightUrl} title={title} className={`block w-full border-0 dark:hidden ${className}`} style={{
    height: resolvedHeight
  }} allow="clipboard-write" />

        {}
        <iframe src={darkUrl} title={title} className={`hidden w-full border-0 dark:block ${className}`} style={{
    height: resolvedHeight
  }} allow="clipboard-write" />
      </div>

      {}
      <div onClick={() => window.open("https://quicko.com", "_blank", "noopener,noreferrer")} className="
        flex items-center justify-center gap-2
        h-14 px-2
        border-x border-b
        border-[#c6c5d0] dark:border-[#313b4a]
        bg-[#f6f7f8] dark:bg-[#1c1c1f]
        cursor-pointer
        rounded-b-md
      ">
        <span className="text-sm leading-none dark:text-zinc-400">
          Powered by
        </span>
        <img src="https://cdn.brandfetch.io/id6OWxavk2/theme/dark/idpHm6Kke3.svg?c=1bxid64Mup7aczewSAYMX&amp;t=1765534843947" alt="Quicko" className="h-4 object-contain" />
      </div>
    </div>;
};

TDS Calculator helps you calculate Tax Deducted at Source on payments to residents and non-residents, showing applicable rates, TDS amount, and net payable instantly.

## Features

<Columns cols={2}>
  <Card title="Instant TDS Calculation" icon="zap">
    Get real-time TDS amount and net payable value as soon as payment details are entered.
  </Card>

  <Card title="Resident & Non-Resident Support" icon="building">
    Calculates TDS correctly for resident and non-resident recipients.
  </Card>

  <Card title="PAN & Section-Based Rates" icon="list">
    Automatically applies correct rates based on PAN availability and TDS section.
  </Card>

  <Card title="Clear Breakdown" icon="clipboard">
    View TDS rate, deducted amount, and payable amount instantly.
  </Card>
</Columns>

## Integration

### Web (iframe)

```html theme={null}
<iframe
  src="https://tools.quicko.com/tds-calculator"
  width="100%"
  height="500"
  frameborder="0"
  allow="clipboard-write"
></iframe>
```

With customization:

```html theme={null}
<iframe
  id="tds-calculator"
  width="100%"
  height="500"
  frameborder="0"
  allow="clipboard-write"
></iframe>

<script>
  const theme = {
    mode: "dark",
    seed: "#006AD4"
  };
  
  const base64Theme = btoa(encodeURIComponent(JSON.stringify(theme)));
  document.getElementById('tds-calculator').src = 
    `https://tools.quicko.com/tds-calculator?theme=${encodedOptions}`;
</script>
```

### Mobile (WebView)

<Tabs>
  <Tab title="iOS (Swift)">
    ```swift theme={null}
    import WebKit

    let theme: [String: Any] = [
        "mode": "light",
        "seed": "#006AD4"
    ]

    if let jsonData = try? JSONSerialization.data(withJSONObject: theme),
       let base64Theme = jsonData.base64EncodedString()
            .addingPercentEncoding(withAllowedCharacters: .urlQueryAllowed) {
        let toolUrl = "https://tools.quicko.com/tds-calculator?theme=\(base64Theme)"
        webView.load(URLRequest(url: URL(string: toolUrl)!))
    }
    ```
  </Tab>

  <Tab title="Android (Kotlin)">
    ```kotlin theme={null}
    import android.util.Base64
    import org.json.JSONObject

    val theme = JSONObject().apply {
        put("mode", "light")
        put("seed", "#006AD4")
    }

    val base64Theme = Base64.encodeToString(
        theme.toString().toByteArray(Charsets.UTF_8),
        Base64.NO_WRAP
    )
    val toolUrl = "https://tools.quicko.com/tds-calculator?theme=$base64Theme"
    webView.loadUrl(toolUrl)
    ```
  </Tab>

  <Tab title="Flutter">
    ```dart theme={null}
    import 'dart:convert';

    final theme = {'mode': 'light', 'seed': '#006AD4'};
    final base64Theme = base64Encode(utf8.encode(jsonEncode(theme)));
    final toolUrl = 'https://tools.quicko.com/tds-calculator?theme=$base64Theme';

    controller.loadRequest(Uri.parse(toolUrl));
    ```
  </Tab>

  <Tab title="React Native">
    ```jsx theme={null}
    import { Buffer } from 'buffer';

    const theme = { mode: 'light', seed: '#006AD4' };
    const base64Theme = Buffer.from(JSON.stringify(theme)).toString('base64');
    const toolUrl = `https://tools.quicko.com/tds-calculator?theme=${base64Theme}`;

    <WebView source={{ uri: toolUrl }} />
    ```
  </Tab>
</Tabs>

## Input Fields

The TDS Calculator collects the following information:

| Field              | Description                                  | Required |
| ------------------ | -------------------------------------------- | -------- |
| Recipient Type     | Individual / HUF / Sole Proprietor or Others | Yes      |
| Residential Status | Resident or Non-Resident                     | Yes      |
| PAN Available      | Whether recipient PAN is available           | Yes      |
| Nature of Payment  | Section & nature of payment                  | Yes      |
| Amount of Payment  | Gross payment amount                         | Yes      |

## Output

The calculator displays:

* **TDS Rate** – Applicable rate based on section and conditions
* **TDS Amount** – Tax deducted at source
* **Amount Payable** – Net amount after TDS deduction
* **TDS Rule** – Explanation of applicable threshold and rate

***

## Use Cases

<AccordionGroup>
  <Accordion title="Content & Tax Guidance Websites" icon="book-open" defaultOpen>
    Enhance tax-related articles and guides by embedding an interactive TDS calculator.
  </Accordion>

  <Accordion title="Tax & Compliance Platforms" icon="file-text">
    Help users calculate accurate TDS before making payments.
  </Accordion>

  <Accordion title="Payroll & Accounting Systems" icon="users">
    Ensure correct TDS deduction for employee and vendor payments.
  </Accordion>
</AccordionGroup>

***

## Demo

<Iframe title="TDS Calculator" lightUrl="https://tools.quicko.com/tds-calculator" darkUrl="https://tools.quicko.com/tds-calculator?theme=ewoibW9kZSI6ImRhcmsiCn0" height={595} className="rounded-l" />

***

## Related

<Columns cols={2}>
  <Card title="Integration Guide" icon="code" href="/projects/tools/integration/index">
    Learn how to embed this tool in your platform.
  </Card>

  <Card title="Customization Options" icon="settings" href="/projects/tools/options/index">
    Match the tool's appearance to your brand.
  </Card>
</Columns>