मुफ़्त कोड स्क्रीनशॉट मेकर
सोशल मीडिया और दस्तावेज़ों के लिए सुंदर कोड स्क्रीनशॉट बनाएं। मुफ़्त, तेज़ और पूरी तरह आपके ब्राउज़र में, बिना साइन-अप के।
अपडेट किया गया
Code Screenshot Generator
Create beautiful code screenshots for social media, documentation, and presentations. Customize themes, fonts, and styles.
Code
Lower values let the background show through the editor pane.
Preview
About Code Screenshot Generator
Create beautiful, shareable code screenshots for social media, documentation, presentations, and tutorials. Customize every aspect to match your style.
Features:
- 18 color themes including Dracula, Monokai, Nord, Solarized, Tokyo Night, Catppuccin, Poimandres, Vitesse, and more
- Auto-detect language or manually select from 33+ languages
- Multiple window styles: macOS, Windows, Linux, or no title bar
- Background options: gradients (with adjustable angle), solid colors, transparent, or custom image
- Adjustable padding, outer margin, border radius, shadow blur, and opacity
- Editor background opacity control for glass-morphism effects
- 12 monospace font families with configurable size, line height, and tab size
- Toggle line numbers with custom starting line number
- Highlight specific lines or ranges with customizable highlight colors
- Line wrapping toggle for long lines
- Optional watermark/branding text with adjustable opacity and 5 position options
- Export as PNG, JPEG, or SVG with 1x-4x resolution scaling
- Copy directly to clipboard as image
- Social media size presets for Twitter, Instagram, LinkedIn, Facebook, presentations, and more with automatic resizing
- Save and load custom style presets (stored locally)
- Reset all settings to defaults with one click
Privacy First: All processing happens locally in your browser. Your code is never sent to any server. Presets are saved in your browser's local storage.
Related Tools
अक्सर पूछे जाने वाले प्रश्न
Code Screenshot टूल क्या है?
Code Screenshot टूल एक मुफ़्त ऑनलाइन उपयोगिता है जो सिंटैक्स हाइलाइटिंग, कस्टम थीम और बैकग्राउंड के साथ सुंदर, साझा करने योग्य कोड छवियाँ बनाती है।
क्या Code Screenshot टूल मुफ़्त है?
हाँ, यह पूरी तरह मुफ़्त है और इसके लिए किसी रजिस्ट्रेशन की ज़रूरत नहीं है। सारी छवि निर्माण प्रक्रिया आपके ब्राउज़र में क्लाइंट-साइड पर होती है।
कौन सी भाषाएँ समर्थित हैं?
Code Screenshot टूल दर्जनों प्रोग्रामिंग भाषाओं के लिए सिंटैक्स हाइलाइटिंग का समर्थन करता है, जिनमें JavaScript, Python, TypeScript, Go, Rust और कई अन्य शामिल हैं।
क्या इस टूल के साथ मेरा डेटा सुरक्षित है?
बिल्कुल। Code Screenshot Maker सब कुछ आपके ब्राउज़र में क्लाइंट-साइड पर प्रोसेस करता है। कोई भी डेटा किसी सर्वर पर अपलोड या संग्रहीत नहीं किया जाता। आपकी सामग्री हर समय आपके डिवाइस पर निजी रहती है।
क्या Code Screenshot Maker मोबाइल डिवाइस पर काम करता है?
हाँ, Code Screenshot Maker पूरी तरह रिस्पॉन्सिव है और स्मार्टफ़ोन तथा टैबलेट पर काम करता है। आप इसे आधुनिक वेब ब्राउज़र वाले किसी भी डिवाइस पर इस्तेमाल कर सकते हैं, किसी ऐप को डाउनलोड करने की ज़रूरत नहीं।
क्या इस टूल का उपयोग करने के लिए मुझे खाता बनाना होगा?
किसी खाते या रजिस्ट्रेशन की ज़रूरत नहीं है। बस अपने ब्राउज़र में Code Screenshot Maker खोलें और तुरंत इस्तेमाल शुरू करें। कोई साइन-अप बाधा या उपयोग प्रतिबंध नहीं है।
मैं Code Screenshot Maker का उपयोग कैसे करूँ?
बस दिए गए फ़ील्ड में अपना इनपुट दर्ज करें, अपनी पसंद के अनुसार सेटिंग्स समायोजित करें, और टूल इसे तुरंत प्रोसेस कर देगा। फिर आप परिणाम को क्लिपबोर्ड पर कॉपी कर सकते हैं या डाउनलोड कर सकते हैं।
कौन से ब्राउज़र समर्थित हैं?
Code Screenshot Maker सभी आधुनिक ब्राउज़रों में काम करता है, जिनमें Chrome, Firefox, Safari, Edge और Opera शामिल हैं। सर्वोत्तम अनुभव के लिए अपने पसंदीदा ब्राउज़र का नवीनतम संस्करण उपयोग करें।
मुझे अपना कोड स्क्रीनशॉट PNG, SVG या JPEG में एक्सपोर्ट करना चाहिए?
फ़ॉर्मेट का चुनाव इस आधार पर करें कि इमेज कहां इस्तेमाल होगी। PNG सोशल पोस्ट, स्लाइड और डॉक्यूमेंटेशन के लिए सुरक्षित डिफ़ॉल्ट है: यह टेक्स्ट को शार्प रखता है, ट्रांसपेरेंट बैकग्राउंड सपोर्ट करता है, और हर जगह एक जैसा दिखता है। SVG एक वेक्टर फ़ॉर्मेट है, इसलिए यह किसी भी साइज़ पर एकदम शार्प बना रहता है और यह तब आदर्श है जब इमेज को बाद में बड़ा किया जा सकता हो, जैसे कोई हीरो ग्राफ़िक या बड़ी प्रेजेंटेशन स्लाइड, हालांकि कुछ प्लेटफ़ॉर्म इसे इनलाइन नहीं दिखाते। JPEG सबसे छोटी फ़ाइल बनाता है लेकिन यह लॉसी कम्प्रेशन इस्तेमाल करता है जिससे बारीक टेक्स्ट किनारे धुंधले हो सकते हैं और यह ट्रांसपेरेंसी स्टोर नहीं कर सकता, इसलिए इसे उन स्थितियों के लिए रखें जहां फ़ाइल साइज़ शार्पनेस से ज्यादा मायने रखता है। यह टूल एक ही प्रीव्यू से तीनों फ़ॉर्मेट एक्सपोर्ट करता है, साथ ही क्लिपबोर्ड पर एक-क्लिक कॉपी भी देता है, जिससे आप बिना दोबारा रेंडर किए हर डेस्टिनेशन के हिसाब से फ़ॉर्मेट मैच कर सकते हैं। हर फ़ॉर्मेट में एक स्निपेट एक्सपोर्ट करके तुलना करें।
मैं ट्रांसपेरेंट बैकग्राउंड वाला कोड स्क्रीनशॉट कैसे बनाऊं?
बैकग्राउंड ऑप्शन को सॉलिड कलर या ग्रेडिएंट की बजाय ट्रांसपेरेंट पर सेट करें, और आसपास का कैनवास बिना किसी फ़िल के एक्सपोर्ट होगा — सिर्फ आपकी स्टाइल्ड कोड विंडो और उसका ड्रॉप शैडो ही बचेगा। यह तब मायने रखता है जब आप स्क्रीनशॉट को किसी और डिज़ाइन के ऊपर रखने की योजना बनाते हैं, जैसे कोई रंगीन स्लाइड, ब्लॉग हेडर या थंबनेल, क्योंकि ट्रांसपेरेंट किनारा एक कठोर आयत दिखाने की बजाय साफ़-सुथरे ढंग से घुल-मिल जाता है। ट्रांसपेरेंसी PNG और SVG एक्सपोर्ट में सुरक्षित रहती है; JPEG अल्फ़ा चैनल स्टोर नहीं कर सकता, इसलिए यह ट्रांसपेरेंट हिस्सों को सॉलिड कलर से भर देता है और यहां इसका इस्तेमाल गलत विकल्प है। सबसे साफ़ कम्पोज़िट के लिए, ड्रॉप शैडो को हल्का रखें या बंद कर दें, क्योंकि भारी शैडो किसी अलग बैकड्रॉप पर अलग-थलग दिख सकता है। ऊपर ट्रांसपेरेंट बैकग्राउंड चुनें, PNG के रूप में एक्सपोर्ट करें, और इमेज को सीधे अपने डिज़ाइन पर डाल दें।
प्लेन टेक्स्ट की बजाय कोड को इमेज के रूप में क्यों पोस्ट करें?
एक स्क्रीनशॉट आपको एकसमान सिंटैक्स हाइलाइटिंग, एक डिज़ाइन किया हुआ विंडो फ्रेम, और ऐसा अटैचमेंट देता है जो Slack, सोशल फीड, PDF और स्लाइड डेक — जो अन्यथा आपकी फॉर्मेटिंग हटा देते — पर एक जैसा दिखता है। किसी ट्वीट या स्लाइड में पेस्ट किया गया कच्चा कोड फीका दिखता है और अपने रंग खो देता है, जबकि आपके असली एडिटर का स्क्रीनशॉट अनावश्यक क्लटर, निजी फ़ाइल पाथ और असंगत साइज़िंग लेकर आता है। इसका ट्रेड-ऑफ यह है कि इमेज न तो सिलेक्ट की जा सकती है और न सर्च की जा सकती है: पाठक इससे कोड कॉपी नहीं कर सकते, और स्क्रीन रीडर इसे ज़ोर से पढ़ नहीं सकते। एक अच्छा नियम यह है कि इमेज का इस्तेमाल तब करें जब लक्ष्य विज़ुअल इम्पैक्ट या कोई फिक्स्ड-लेआउट माध्यम हो — जैसे सोशल पोस्ट, थंबनेल या कॉन्फ्रेंस टॉक — और ट्यूटोरियल व डॉक्यूमेंटेशन में असली, कॉपी करने योग्य कोड ब्लॉक ही रखें जहां लोगों को स्निपेट लेने की जरूरत होती है। कुछ ही सेकंड में एक साफ़-सुथरी, शेयर करने लायक इमेज बनाने के लिए ऊपर अपना कोड पेस्ट करें।
हाई-रेज़ॉल्यूशन स्क्रीन पर शार्प कोड स्क्रीनशॉट के लिए मुझे कौन-सा एक्सपोर्ट स्केल इस्तेमाल करना चाहिए?
रास्टर एक्सपोर्ट 1x से 4x तक के स्केल को सपोर्ट करते हैं, और 2x को रेकमेंडेड डिफ़ॉल्ट माना जाता है। स्केल रेंडर की गई इमेज के पिक्सल डाइमेंशन को गुणा करता है, इसलिए 2x एक्सपोर्ट चौड़ाई और ऊंचाई को लगभग दोगुना कर देता है, जिससे टेक्स्ट Retina जैसी हाई-डेंसिटी डिस्प्ले पर शार्प बना रहता है जहां 1x इमेज धुंधली या फ़ज़ी दिख सकती है। 1x का इस्तेमाल तभी करें जब आपको सबसे छोटी फ़ाइल चाहिए हो और इमेज को छोटे आकार में देखा जाएगा। बड़े फ़ॉर्मेट जैसे प्रेजेंटेशन स्लाइड या प्रिंट के लिए 3x या 4x तक बढ़ें, ध्यान रखें कि हर स्टेप के साथ फ़ाइल साइज़ काफ़ी बढ़ जाता है। स्केल केवल PNG और JPEG आउटपुट को प्रभावित करता है; SVG वेक्टर-आधारित है और बिना किसी स्केल सेटिंग के किसी भी साइज़ पर शार्प बना रहता है। एक्सपोर्ट करने से पहले स्केल सेट करें ताकि फ़ाइनल डाइमेंशन उस जगह से मेल खाएं जहां इमेज दिखाई जाएगी, फिर परिणाम डाउनलोड या कॉपी करें।
क्या मैं Twitter या Instagram जैसे किसी खास सोशल प्लेटफ़ॉर्म के लिए कोड स्क्रीनशॉट का साइज़ तय कर सकता हूं?
हां। यह टूल ऐसे साइज़िंग प्रीसेट देता है जो आम प्लेटफ़ॉर्म डाइमेंशन से मेल खाते हैं ताकि आपका स्क्रीनशॉट बिना मैनुअल क्रॉपिंग के सही एस्पेक्ट रेशियो में तैयार हो। आप 1200 x 675 पर Twitter/X पोस्ट, 1080 x 1080 पर Instagram स्क्वायर पोस्ट या 1080 x 1920 पर Story, 1200 x 627 पर LinkedIn पोस्ट, 1200 x 630 पर Facebook पोस्ट, 1000 x 420 पर Dev.to कवर, या 1920 x 1080 या 1024 x 768 पर प्रेजेंटेशन स्लाइड चुन सकते हैं। कोई प्रीसेट चुनने से आपका कोड उसी कैनवास में फ़िट हो जाता है ताकि वह फ़ीड में सही ढंग से दिखे, न कि प्लेटफ़ॉर्म द्वारा अजीब तरीके से क्रॉप किया जाए। अगर कोई भी फ़िट न बैठे, तो इसे Auto पर छोड़ दें और कैनवास आपके कोड के हिसाब से खुद-ब-खुद साइज़ हो जाएगा। शार्प और सही अनुपात वाली इमेज के लिए किसी प्रीसेट को 2x एक्सपोर्ट स्केल के साथ मिलाएं, फिर उसे डाउनलोड करके सीधे पोस्ट करें।
संबंधित टूल
मुफ़्त CSS मिनिफायर ऑनलाइन
फ़ाइल आकार कम करने और लोडिंग गति सुधारने के लिए CSS कोड को मिनिफाई करें। मुफ़्त, तेज़ और पूरी तरह आपके ब्राउज़र में काम करता है, बिना साइन-अप के।
मुफ़्त JavaScript मिनिफायर
फ़ाइल आकार कम करने और प्रदर्शन बेहतर करने के लिए JavaScript कोड को मिनिफाई करें। मुफ़्त, तेज़ और पूरी तरह आपके ब्राउज़र में काम करता है, बिना साइन-अप के।
मुफ़्त HTML मिनिफायर ऑनलाइन
पेज का आकार और लोडिंग समय घटाने के लिए HTML कोड को मिनिफाई करें। मुफ़्त, तेज़ और पूरी तरह आपके ब्राउज़र में, बिना साइन-अप के।
मुफ़्त SQL फ़ॉर्मेटर और ब्यूटिफायर
बेहतर पठनीयता के लिए SQL क्वेरी को फ़ॉर्मेट और सुंदर बनाएं। मुफ़्त, तेज़ और पूरी तरह आपके ब्राउज़र में, बिना साइन-अप के।
कोड स्क्रीनशॉट मेकर के बारे में
कोड स्क्रीनशॉट मेकर सोर्स कोड के एक साधारण स्निपेट को एक आकर्षक, शेयर करने लायक इमेज में बदल देता है। अपना कोड पेस्ट करें, कोई थीम चुनें, और यह टूल उसे सिंटैक्स हाइलाइटिंग के साथ एक स्टाइल्ड विंडो फ्रेम के अंदर, किसी रंगीन या ग्रेडिएंट बैकड्रॉप पर रेंडर कर देता है — PNG, SVG या JPEG के रूप में डाउनलोड करने के लिए तैयार। इसकी जरूरत इसलिए पड़ती है क्योंकि किसी ट्वीट, स्लाइड या ब्लॉग हेडर में पेस्ट किया गया कच्चा कोड फीका दिखता है और अपनी हाइलाइटिंग खो देता है, जबकि आपके एडिटर का स्क्रीनशॉट अनावश्यक क्लटर, निजी फ़ाइल पाथ और असंगत साइज़िंग लेकर आता है।
यह डेवलपर्स, टेक्निकल राइटर्स, कोर्स क्रिएटर्स और उन सभी के लिए बनाया गया है जो किसी ऑडियंस को कोड समझाते हैं — चाहे वह Twitter/X थ्रेड हो, Dev.to कवर इमेज हो, कॉन्फ्रेंस स्लाइड हो, या डॉक्यूमेंटेशन हो। सब कुछ आपके ब्राउज़र में ही चलता है। इमेज क्लाइंट-साइड पर रेंडर होती है और आप जो भी पेस्ट करते हैं वह किसी सर्वर पर अपलोड नहीं होता, इसलिए प्रोप्राइटरी या अप्रकाशित कोड भी आपकी डिवाइस पर ही सुरक्षित रहता है। किसी साइन-अप की जरूरत नहीं है।
कोड स्क्रीनशॉट कैसे बनाएं
- अपना कोड पेस्ट करें एडिटर में। भाषा को Auto Detect पर छोड़ दें और टूल सिंटैक्स से उसे खुद पहचान लेगा, या 30 से ज्यादा सपोर्टेड भाषाओं में से कोई एक चुनें — जिनमें JavaScript, TypeScript, Python, Go, Rust, Java, C/C++, C#, SQL, Bash, JSON, YAML और भी बहुत कुछ शामिल हैं।
- कोई थीम चुनें। यहां 18 सिंटैक्स थीम मौजूद हैं, One Dark, Dracula, Monokai, Nord और Solarized जैसी एडिटर की पसंदीदा थीमों से लेकर Tokyo Night, Catppuccin Mocha और Synthwave 84 तक।
- फ्रेम को स्टाइल करें। एक macOS, Windows या Linux विंडो बार जोड़ें (या कुछ भी नहीं), वैकल्पिक फ़ाइल टाइटल सेट करें, लाइन नंबर टॉगल करें, और पैडिंग, कॉर्नर रेडियस व ड्रॉप शैडो को एडजस्ट करें।
- बैकग्राउंड सेट करें किसी सॉलिड कलर, ट्रांसपेरेंट कैनवास, या 20 ग्रेडिएंट प्रीसेट में से किसी एक पर, साथ ही ग्रेडिएंट एंगल को भी नियंत्रित करें।
- एक्सपोर्ट करें। शेयरिंग के लिए PNG डाउनलोड करें, शार्प वेक्टर स्केलिंग के लिए SVG, या छोटी फ़ाइल साइज़ के लिए JPEG — या इमेज को सीधे क्लिपबोर्ड पर कॉपी करें।
थीम, फ़ॉन्ट और एक्सपोर्ट विकल्प
कोड इमेज में टाइपोग्राफी मायने रखती है, इसलिए आप JetBrains Mono, Fira Code, Source Code Pro, IBM Plex Mono और Cascadia Code जैसे 12 मोनोस्पेस फ़ॉन्ट्स के बीच स्विच कर सकते हैं और फ़ॉन्ट साइज़ को अपनी पसंद के अनुसार ट्यून कर सकते हैं। हाई-डेंसिटी डिस्प्ले पर शार्प रिज़ल्ट के लिए, रास्टर एक्सपोर्ट 1x से 4x तक के स्केल को सपोर्ट करते हैं — 2x को रेकमेंडेड डिफ़ॉल्ट माना जाता है और यह रेंडर की गई इमेज के पिक्सल डाइमेंशन को लगभग दोगुना कर देता है।
यह टूल ऐसे साइज़िंग प्रीसेट भी देता है जो आम प्लेटफ़ॉर्म डाइमेंशन से मेल खाते हैं, ताकि आपका स्क्रीनशॉट बिना मैनुअल क्रॉपिंग के सही एस्पेक्ट रेशियो में तैयार हो:
- Twitter / X पोस्ट — 1200 x 675 (16:9)
- Instagram पोस्ट — 1080 x 1080 (स्क्वायर); Story — 1080 x 1920 (9:16)
- LinkedIn पोस्ट — 1200 x 627
- Facebook पोस्ट — 1200 x 630
- Dev.to कवर — 1000 x 420
- प्रेजेंटेशन स्लाइड — 1920 x 1080 (16:9) या 1024 x 768 (4:3)
या फिर इसे Auto पर छोड़ दें ताकि कैनवास आपके कोड के हिसाब से खुद-ब-खुद साइज़ हो जाए।
पेस्ट किए गए टेक्स्ट से कोड स्क्रीनशॉट क्यों बेहतर है
कोड को इमेज के रूप में पोस्ट करना एक सोचा-समझा ट्रेड-ऑफ है। इसमें आपको एकसमान सिंटैक्स हाइलाइटिंग, एक डिज़ाइन किया हुआ लुक, और एक ऐसा अटैचमेंट मिलता है जो हर जगह — Slack, सोशल फीड, PDF और स्लाइड डेक — पर एक जैसा दिखता है, जबकि ये माध्यम आपकी फॉर्मेटिंग को अन्यथा हटा देते। इसकी कीमत यह है कि इमेज न तो सिलेक्ट की जा सकती है और न ही सर्च की जा सकती है: पाठक इससे आपका कोड कॉपी नहीं कर सकते, और स्क्रीन रीडर इसे पढ़ नहीं सकते। व्यावहारिक नियम यह है कि स्क्रीनशॉट का इस्तेमाल तब करें जब लक्ष्य विज़ुअल इम्पैक्ट या कोई फिक्स्ड-लेआउट माध्यम हो — जैसे सोशल पोस्ट, थंबनेल या टॉक — और डॉक्यूमेंटेशन व ट्यूटोरियल में असली, कॉपी करने योग्य कोड ब्लॉक ही रखें जहां लोगों को स्निपेट लेने की जरूरत होती है। एक्सेसिबिलिटी और पहुंच के लिए, इमेज के साथ पास में असली कोड या उसका लिंक भी दें।
बार-बार इस्तेमाल होने वाले लुक पर समय बचाने के लिए, आप अपनी चुनी हुई थीम, फ़ॉन्ट, पैडिंग और बैकग्राउंड को ब्राउज़र में एक नामित प्रीसेट के रूप में सेव कर सकते हैं और अगले स्क्रीनशॉट के लिए उसे दोबारा लोड कर सकते हैं। शुरू करने के लिए ऊपर एक स्निपेट पेस्ट करें, और एक्सपोर्ट करने से पहले कंट्रोल्स को तब तक एडजस्ट करें जब तक प्रीव्यू आपकी पसंदीदा स्टाइल से मेल न खा जाए।