Design
HSL-Farbwerte in LAB für Farbverwaltung umwandeln mit Alphakanal-Unterstützung
hsl-to-lab-converterDesign
Rechnet Figma-px-Werte in die korrekten Plattform-Einheiten um und erzeugt eine Entwickler-Spec-Card: iOS-pt (@1x/@2x/@3x mit gerenderten px je Skalierung), Android-dp/sp (Render-Tabelle mdpi…xxxhdpi und Schriftskalierung), Web-rem/vw mit clamp()-Snippet; Prüfung der minimalen Touch-Ziele (44pt iOS / 48dp Android / 44px und 24px WCAG) samt Material-Fensterklassen und Tailwind-Breakpoints.
figma-ios-android-pt-dp-sp-responsive-design-spec-cardDesign
Lade eine TTF-, OTF-, WOFF- oder WOFF2-Datei hoch (WOFF2 wird automatisch dekomprimiert) und prüfe alle Metadaten: Familie/Subfamilie/Designer/Copyright/Version, Glyphenanzahl, unitsPerEm, Strichstärke und Breite, Kursivwinkel, Stilflags und Bounding-Box; Heatmap der Unicode-Blockabdeckung; SVG-Glyphenvorschau (eigener Text, Auto-Stichprobe für Icon-Fonts); liga-Ligaturen und OpenType-Features; fvar-Achsen und benannte Instanzen variabler Fonts.
font-file-inspectorDesign
Vorschau einer Titel- und Textschrift mit echtem Text, Größen, Gewichten, Zeilenhöhen, Zeichensatz und CSS.
font-pairing-preview-cardDesign
Fügen Sie ein Figma-/Tokens-Studio-Variablen-JSON ein und exportieren Sie nach Tailwind, shadcn CSS-Variablen, Style Dictionary oder SCSS. Erhält Farb-, Abstands- und Font-Tokens mit Typ-Inferenz.
figma-tokens-exportDesign
Berechnet den Bildwinkel einer Kamera aus Brennweite und Sensorgröße sowie die Szenenabdeckung auf Distanz.
field-of-view-calculatorDesign
Extrahiert Design-Tokens — Farben, Zahlen, Schriftgrößen und Strings — aus einem ECharts-Theme-JSON und exportiert sie direkt in Ihr Design-System. Fügen Sie ein Theme-Objekt ein (das per echarts.init(dom, themeName) registriert wird) und das Werkzeug durchläuft jedes Leaf, taggt jede Farbe (optional Named/rgb → hex normalisiert), jeden Abstand, jede Schriftgröße und jeden String und gibt saubere CSS-Variablen, ein Tailwind theme.extend, ein Style Dictionary tokens.json oder SCSS-Variablen aus. Überbrückt die Lücke zwischen einem ECharts-Visualisierungs-Theme und Figma/CSS/Tailwind-Design-Tokens, ohne jeden Wert von Hand zu kopieren.
echarts-theme-token-extractorDesign
Erzeugt eine saubere, kopierfertige HTML-E-Mail-Signatur, die in Gmail, Outlook und Apple Mail korrekt dargestellt wird — mit Avatar/Logo, Social Icons (automatisch aus Ihren Links erkannt), Akzentfarbe, Hell/Dunkel/Auto-Theme und einem tabellenbasierten, E-Mail-sicheren Layout mit Inline-Styles. HTML kopieren und direkt in den Mail-Client einfügen.
email-signature-html-builderDesign
Fügt Weichzeichnereffekte zu Bildern mit einstellbarer Stärke und mehreren Weichzeichnertypen hinzu
image-blurDesign
Bildhelligkeitsniveaus mit Echtzeit-Vorschau und präziser Steuerung anpassen
image-brightnessDesign
Bildkontrastniveaus mit präziser Steuerung für verbesserte Bildklarheit anpassen
image-contrastDesign
Schneiden Sie Bilder auf bestimmte Abmessungen oder Seitenverhältnisse mit benutzerdefinierter Positionierung zu
image-cropper