💻 Programmierung & Entwicklung
Advanced Color Picker Tool
Beispiel-Ausgaben
So antworten ChatGPT, Claude und Gemini typischerweise auf diesen Prompt:
I'll create a comprehensive color picker tool for you! The interface will feature a color wheel with RGB/HSL sliders, eyedropper functionality, and real-time format conversion. I'll implement the palette generator with all five harmony schemes, a favorites system with local storage, WCAG contrast checker with AAA/AA ratings, and a gradient builder with visual preview. The export functionality will include ASE, JSON, CSS variables, and code snippets with one-click copying. Would you like me to start with the HTML structure and core color conversion functions?
I can help you build this color tool, though I should note some limitations: I can't create an actual eyedropper (requires browser APIs you'd need to implement), and ASE export requires binary file handling that's complex in pure JavaScript. That said, I'll create a fully functional tool with the color wheel, sliders, format conversions, harmony generators, gradient builder, and WCAG checker. The accessibility features and code export will be particularly robust. Should I proceed with a modular architecture that separates the color engine from the UI components?
I'll generate a complete color picker application with the requested features. The implementation will use the Canvas API for the color wheel, Web Storage API for favorites, and the Clipboard API for copy functionality. For WCAG compliance checking, I'll calculate contrast ratios per WCAG 2.1 guidelines (minimum 4.5:1 for normal text, 3:1 for large text). The color naming will use a nearest-neighbor algorithm against a database of ~1000 named colors. Note that ASE export requires ArrayBuffer manipulation for Adobe's binary format. Here's the implementation starting with the core ColorConverter class.
So nutzt du diesen Prompt
Kopiere den Prompt oben oder klicke einen "Öffnen in"-Button um ihn direkt in deiner bevorzugten KI zu starten. Du kannst den Text dann an deinen Anwendungsfall anpassen — z.B. Platzhalter wie [dein Thema] durch echten Kontext ersetzen.
Welches KI-Modell funktioniert am besten
Claude Opus 4 und Sonnet 4.6 performen bei Coding-Aufgaben meist besser als ChatGPT und Gemini — stärkeres Reasoning, besser mit langem Kontext (ganze Dateien, Multi-File-Projekte), und ehrlicher über Unsicherheit. ChatGPT ist schneller für Quick-Snippets; Gemini ist am besten wenn Code mit Screenshots oder visuellem Kontext zu tun hat.
Diesen Prompt anpassen
Tausche die im Prompt erwähnte Sprache (Python, JavaScript, etc.) gegen deinen Stack. Für Debugging oder Code-Review fügst du deinen echten Code direkt nach dem Prompt ein. Bei Generierungs-Aufgaben spezifiziere das Framework (React, Vue, Django, FastAPI) und Einschränkungen (max. Zeilen, keine externen Libraries, muss async sein).
Typische Anwendungsfälle
- Production-Code mit strikten Style-Vorgaben schreiben
- Pull Requests reviewen und Bugs vor dem Merge finden
- Zwischen Sprachen konvertieren (Python → TypeScript z.B.)
- Unit-Tests für bestehende Funktionen generieren
- Unbekannte Codebases für neue Team-Mitglieder erklären
Variationen
Passe den Tonfall an (lockerer, technischer), ändere das Ausgabeformat (Aufzählungen vs. Absätze) oder füge Einschränkungen hinzu (Wortlimits, Zielgruppe).