# Canvas, SVG और localStorage — एचटीएमएल

Source: https://www.geekswithgeeks.com/hi/html/html-canvas-svg-localstorage

> HTML5 के बड़े API का एक संक्षिप्त परिचय।

## canvas — स्क्रिप्ट से पिक्सल

`<canvas>` एक खाली ड्रॉइंग सतह है — इस पर सब कुछ JavaScript से, पिक्सल दर पिक्सल बनाया जाता है। गेम्स और चार्ट के लिए बेहतरीन।

## SVG — मार्कअप के रूप में आकार

`<svg>` आकारों को पिक्सल के बजाय XML टैग (`<circle>`, `<path>`) के रूप में बताता है — ये किसी भी साइज़ में सही स्केल होते हैं।

## localStorage — ब्राउज़र स्टोरेज

हर ब्राउज़र में बना एक छोटा की-वैल्यू स्टोर जो टैब बंद होने के बाद भी बना रहता है — किसी सर्वर की ज़रूरत नहीं।

## एक संक्षिप्त झलक

तीनों सादे HTML के अंदर रहते हैं, एक छोटी स्क्रिप्ट से चलते हुए।

```html
<canvas id="c" width="100" height="100"></canvas>
<svg width="100" height="100">
  <circle cx="50" cy="50" r="40" fill="orange" />
</svg>
<script>
  localStorage.setItem('theme', 'dark');
  console.log(localStorage.getItem('theme')); // "dark"
</script>
```