Zurück

#css

8 APIs mit diesem Tag

Modular Scale API

Generieren Sie eine modulare (geometrische) Skala für Typografie und Abstände. Wählen Sie eine Basisgröße und ein Verhältnis – ein benanntes musikalisches Intervall (kleine Sekunde, große Sekunde, kleine Terz, große Terz, perfekte Quarte, übermäßige Quarte, perfekte Quinte, kleine Sexte, goldener Schnitt, große Sexte, kleine Septime, große Septime, Oktave und mehr), eine einfache Zahl wie 1,25 oder ein Intervall wie 3:2 – und der Skalen-Endpunkt gibt eine harmonische Reihe von Größen zurück, die von der Basis auf- und absteigen, wobei jeder Wert Basis × Verhältnis^Schritt ist (Schritt 0 ist die Basis). Wählen Sie, wie viele Schritte oberhalb und unterhalb, die Rundung und ein optionales Einheitssuffix (px, rem, em), sodass die Werte bereit zum Einfügen in CSS oder Design-Tokens zurückgegeben werden. Der Verhältnisse-Endpunkt listet jedes benannte Verhältnis mit seinem Dezimalwert auf. Eine modulare Skala verleiht Typografie, Abständen und Layout einen konsistenten Rhythmus anstelle von willkürlichen Pixelwerten. Reine lokale Berechnung – kein Schlüssel, kein Drittanbieter-Dienst, sofort. Live, nichts gespeichert. 3 Endpunkte. Dies erzeugt eine numerische Größenskala; für Farbskalen und Verläufe verwenden Sie die Gradient API.

api.oanor.com/modularscale-api

Color Name API

Benennen Sie jede Farbe. Der nearest-Endpunkt akzeptiert eine Farbe als Hex, einen rgb()-Wert, ein r,g,b-Tripel oder einen anderen Namen und gibt die nächstgelegene der 140+ CSS-Farbnamen zurück – wahrnehmungsbasiert mit CIE76 Lab-Distanz abgeglichen, nicht naiv RGB, sodass der Name tatsächlich richtig aussieht – zusammen mit der Distanz und ob es eine exakte Übereinstimmung ist. Der name-Endpunkt löst ein CSS-Farbkeyword (z. B. rebeccapurple, cornflowerblue) in seinen Hex- und RGB-Wert auf, und list gibt den gesamten Satz benannter Farben zurück. Perfekt für Design-Tools und Farbwähler, Barrierefreiheit und Theming, Umwandlung von Marken-Hex-Codes in menschenlesbare Bezeichnungen und Benennung von Farben in generierten Paletten. Reine lokale Berechnung – kein Schlüssel, kein Drittanbieter-Dienst, sofort. Live, nichts wird gespeichert. 4 Endpunkte. Abgrenzung zu Farbkonvertierungs-/Paletten-/Kontrast-Tools, die keine Farben benennen.

api.oanor.com/colorname-api

Data URI API

Codieren Sie Inhalte in eine data:-URI und decodieren Sie eine data:-URI zurück zu ihrem Inhalt (RFC 2397). data:-URIs betten eine Datei direkt in HTML, CSS, JSON oder E-Mail ein – perfekt für kleine Bilder, SVGs, Schriftarten und Symbole, die Sie ohne separate HTTP-Anfrage einbetten möchten. Der Encode-Endpunkt verpackt Ihren Inhalt (als UTF-8-Text, Base64 oder Hex für Binärdaten) mit einem gewählten Medientyp und Zeichensatz, entweder in Base64- oder URL- (Prozent-) Kodierung; der Decode-Endpunkt analysiert jede data:-URI und gibt ihren Medientyp, Zeichensatz, ob Base64 verwendet wurde, die Bytegröße sowie die Nutzlast als Text und/oder Base64 zurück. Reine lokale Berechnung – kein Schlüssel, kein Drittanbieter-Dienst, sofort; bis zu 4 MB per POST. Live, nichts wird gespeichert. 3 Endpunkte. Unterscheidet sich von einem einfachen Base64/Hex-Kodierer und von SVG-spezifischen Werkzeugen.

api.oanor.com/dataurl-api

Gradient API

Generieren Sie Farbverläufe und Farbskalen programmatisch. Erstellen Sie eine gleichmäßig verteilte Skala von N Farben zwischen zwei oder mehr Stoppunkten (interpoliert in einem wahrnehmungsglatten Farbraum — lab, lch, oklab, oklch — oder einfachem rgb/hsl), erhalten Sie eine einzelne interpolierte Farbe an einer beliebigen Position zwischen zwei Farben und erstellen Sie einen fertigen CSS-Verlaufsstring (linear mit beliebigem Winkel oder radial) aus einer Liste von Stoppunkten. Farben akzeptieren Hex (#f00, #ff0000) oder CSS-Namen (red, steelblue). Perfekt für Datenvisualisierungs-Farbskalen, Heatmaps, Diagrammpaletten, Themengenerierung und UI-Hintergründe. Reine lokale Berechnung — kein Schlüssel, kein Drittanbieterdienst, sofort. Live, nichts gespeichert. 4 Endpunkte. Abgrenzung zu Farbkonvertierung / harmonischen Paletten (eine Basisfarbe) und Bildpalettenextraktion.

api.oanor.com/gradient-api

Prettier API

Formatieren und verschönern Sie Quellcode mit Prettier, dem De-facto-Code-Formatter. Übergeben Sie Code und eine Sprache und erhalten Sie ihn konsistent neu formatiert: JavaScript, JSX, TypeScript, TSX, CSS, SCSS, LESS, GraphQL und Vue. Passen Sie die Ausgabe mit Druckbreite, Tabulatorbreite / Tabs, Semikolons, einfachen vs. doppelten Anführungszeichen und Stil für nachgestellte Kommas an. Syntaxfehler werden mit einer klaren Nachricht zurückgegeben. Das Gegenteil eines Minifiers. Reine lokale Verarbeitung — kein Schlüssel, kein Drittanbieter-Dienst, sofort. Live. 3 Endpunkte. Entwickelt für Code-Editoren und Spielplätze, Einfügen-und-Formatieren-Werkzeuge, Snippet-Verschönerung, Dokumentation und CI-Formatierungsprüfungen. Ergänzt den SQL-Formatter und die JSON/YAML/Markdown-Werkzeuge (die ihre eigenen Sprachen abdecken).

api.oanor.com/prettier-api

Minify API

Verkleinern Sie Ihre Web-Assets. Minifizieren Sie CSS, JavaScript und HTML über eine einfache API und erhalten Sie die kompakte Ausgabe sowie die Anzahl der Bytes (und den Prozentsatz), die Sie gespart haben. CSS wird mit clean-css minifiziert, JavaScript mit Terser (mit optionalem Namens-Mangling und Komprimierungsoptionen) und HTML mit html-minifier-terser (Zusammenführen von Leerzeichen, Entfernen von Kommentaren und redundanten Attributen sowie Minifizieren von Inline-CSS und JS). Übergeben Sie die Quelle als Parameter oder im Anforderungstext (bis zu 5 MB). Reine lokale Verarbeitung — kein Schlüssel, kein Drittanbieter-Dienst, sofort. Live. 4 Endpunkte. Entwickelt für Build-Pipelines, On-the-fly-Asset-Optimierung, E-Mail-HTML-Verschlankung, CMS- und CDN-Tooling sowie Seitenladegeschwindigkeits-Optimierung.

api.oanor.com/minify-api

Kann ich API verwenden

Browser-Funktionskompatibilitätsdaten als API – die „Can I Use“-Unterstützungstabellen für über 550 Webplattformfunktionen in 19 Browsern (Chrome, Edge, Firefox, Safari, iOS Safari, Samsung Internet, Opera, IE und mehr). Suchen Sie nach einer beliebigen Funktion (flexbox, css-grid, webp, fetch, websockets, …) für deren vollständige Unterstützungsmatrix: aktuelle Unterstützung pro Browser, die erste Version mit vollständiger Unterstützung, teilweise/mit Präfix/deaktivierte Flags und Hinweise, der Spezifikationsstatus, Kategorien, Schlüsselwörter, globale Nutzungsanteile und Referenzlinks. Stellen Sie eine einzelne Frage zu Funktion×Browser, listen oder filtern Sie Funktionen nach Kategorie, suchen Sie Funktionen nach Schlüsselwort und erhalten Sie die Browser-/Agentenliste mit Versionsverläufen sowie die Kategorie-/Statuslegende. Unterstützt durch den öffentlichen caniuse-db-Datensatz (alle 12 Stunden aktualisiert); Abfrageergebnisse werden live berechnet. 7 Endpunkte. Entwickelt für Build-Tools, Polyfill-Entscheidungen, Kompatibilitäts-Dashboards, Linter und Dokumentation. Kein vorgeschalteter Schlüssel.

api.oanor.com/caniuse-api

Fonts API

Der Google Fonts-Katalog als API – 1.900+ Open-Source-Schriftfamilien mit allem, was Sie zum Auswählen und Einbetten einer Schriftart benötigen. Suchen Sie eine Familie (z. B. Roboto → Kategorie, verfügbare Gewichte, Achsen variabler Schriftarten, Teilmengen und eine gebrauchsfertige CSS-Embed-URL); suchen Sie nach Name, Kategorie (Sans Serif, Serif, Display, Handwriting, Monospace), Teilmenge, Gewicht oder Unterstützung variabler Schriftarten; oder listen Sie die beliebtesten Familien auf. Jeder Datensatz enthält die Gewichte/Styles, variablen Achsen (wght, wdth, …), Sprachteilmengen, Designer, Beliebtheitsrang und eine Google Fonts CSS2-Embed-URL. Ideal für Designtools, Website-Builder, Schriftartenauswähler und Theming-Systeme.

api.oanor.com/fonts-api