# Marke von der Website importieren: Markenkit in einem Schritt

[Canonical HTML page](https://gradiently.design/de/guide/import-brand-from-website)

Deine Website kennt schon deinen Namen, deinen Einzeiler, deine Farbe und dein Icon. Ein Button auf der Seite Marke liest sie aus, und du entscheidest, was bleibt.

## The short version

- Gradiently kann die Website einer Marke lesen und ihren Namen, ihre Beschreibung, ihre Themenfarbe und ihr Icon für das Markenkit anbieten.
- Nichts wird automatisch hinzugefügt: Jeder Fund erscheint als Vorschlag, den du übernehmen oder ignorieren kannst.
- Der Name kommt aus den Namens-Tags der Website, die Beschreibung aus ihrer Meta-Description, die Farbe aus ihrem theme-color-Tag und das Icon aus ihrem Touch-Icon oder Favicon.
- Eine Website ohne theme-color-Tag oder nur mit einem SVG-Icon liefert weniger Vorschläge, ein paar Zeilen im HTML-Head verbessern also das Ergebnis.
- Eine Website zu lesen gehört zum Markenkit, das in Gradiently Pro enthalten ist.

Um in Gradiently deine **Marke von der Website zu importieren**, öffne die Seite Marke, gib unter Identität im Feld **Website** deine Adresse ein und wähle **Website lesen**. Gradiently holt Name, Beschreibung, Themenfarbe und Icon der Website und bietet dir jedes einzeln an: den Namen übernehmen, die Beschreibung als Slogan oder für „Über uns“ verwenden, die Farbe zu deinen Markenfarben hinzufügen, das Icon als Logo hinzufügen. Du wählst aus, was hineinkommt. Das dauert ein paar Sekunden und erspart dir den mühsamsten Teil beim Einrichten eines Kits.

## So importierst du deine Marke von einer Website

1. **Öffne die Seite Marke** Wähle die Marke, die du ausfüllen willst. Jede Marke in deinem Konto hat ihr eigenes Kit, achte also darauf, in der richtigen zu sein.
2. **Gib die Website ein** Tippe unter **Identität** die Adresse ins Feld **Website**. Eine einfache Domain wie `crumb.co` reicht; das https brauchst du nicht.
3. **Wähle Website lesen** Gradiently ruft die Seite einmal auf, liest ihren Head und holt ihr Icon. Währenddessen zeigt der Button **Wird gelesen…**.
4. **Übernimm, was passt** Jeder Fund erscheint mit eigenem Button: **„Crumb“ als Namen verwenden**, **Beschreibung als Slogan verwenden**, **Beschreibung für „Über uns“ verwenden**, **Farbe hinzufügen**, **Icon als Logo hinzufügen**. Ignoriere alles, was nicht stimmt.
5. **Nach Änderungen erneut lesen** Aktualisierst du deine Website, wähle **Erneut lesen**. Ist alles Nützliche schon im Kit, sagt dir die Seite das.

Die Farbe der Website taucht später auch als Vorschlag im Bereich **Farben** auf, beschriftet mit dem Namen deiner Website, sodass du sie dort hinzufügen kannst, falls du sie beim ersten Mal übersprungen hast.

## Was Gradiently von deiner Website liest

Gelesen wird nur die öffentliche Startseite unter der Adresse, die du angibst, und nur die Teile, die die Marke beschreiben. Andere Seiten werden nicht durchsucht, es gibt keine Anmeldung, und deine Inhalte werden nicht gelesen.

| Vorschlag fürs Kit | Woher er kommt | Wird zu |
| --- | --- | --- |
| Name | `og:site_name`, `application-name` oder der Titel der Apple-Web-App | Markenname |
| Beschreibung | `meta name="description"` oder die Open-Graph-Beschreibung | Slogan oder „Über uns“ |
| Farbe | `meta name="theme-color"` als Hex oder rgb() | Eine Markenfarbe |
| Icon | Das größte `apple-touch-icon`, andere Raster-Icons, dann `/favicon.ico` | Ein Logo, bis 256 px |

Vier Vorschläge und ihre Quellen. Das Icon wird als PNG mit höchstens 256 px neu gezeichnet, bevor Gradiently es übernimmt.

Zwei Details lohnt es sich zu kennen. SVG-Icons werden übersprungen, weil Gradiently fremde SVGs nicht rastert, eine Website nur mit SVG-Favicon liefert also kein Icon. Und die Farbe muss ein einfacher Hex- oder rgb()-Wert sein; eine CSS-Variable im theme-color-Tag lässt sich nicht lesen.

## Mach deine Website leicht lesbar

Liefert Website lesen wenig, hilft meist ein paar Zeilen im HTML-Head deiner Website. Sie helfen nicht nur Gradiently: Browser nutzen theme-color für die Adressleiste auf Handys, und Linkvorschauen nutzen deine Open-Graph-Tags. [Open-Graph-Tags](https://gradiently.design/de/guide/open-graph-tags) und [Favicon-Design](https://gradiently.design/de/guide/favicon-design) gehen tiefer.

```html
<head>
  <title>Crumb · Sourdough bakery in Leeds</title>
  <meta name="description" content="Slow sourdough and pastries, baked every morning on Kirkgate.">
  <meta property="og:site_name" content="Crumb">
  <meta name="theme-color" content="#c2410c">
  <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
  <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32.png">
</head>
```

Alles, wonach Website lesen sucht: ein Website-Name, eine einzeilige Beschreibung, eine Themenfarbe in Hex und ein Raster-Touch-Icon in 180×180.

### Liefert wenig

- Keine Meta-Description oder eine voller Keywords
- Kein theme-color-Tag oder eine CSS-Variable darin
- Nur ein SVG-Favicon
- Eine Startseite, die auf einen Login weiterleitet

### Liefert einen vollen Start fürs Kit

- Ein ehrlicher Satz darüber, was du tust
- Eine Themenfarbe in Hex, die zu deinem Logo passt
- Ein PNG-Touch-Icon in 180×180
- Eine öffentliche Startseite, die schnell lädt

## Was du nach dem Import tun solltest

Der Import gibt dir ein Fundament, kein fertiges Kit. Vier Dinge lohnen sich als Nächstes, in dieser Reihenfolge.

1. **Lade richtige Logodateien hoch.** Ein Favicon ist winzig und quadratisch. Füge dein vollständiges Logo als PNG, JPEG, WebP, GIF oder AVIF hinzu, eines für dunkle und eines für helle Hintergründe; siehe [Logo auf einem Verlaufshintergrund](https://gradiently.design/de/guide/logo-on-gradient-background).
2. **Ergänze die Farben.** Eine Themenfarbe ist ein Anfang. Füge eine unterstützende Farbe sowie dein dunkelstes und hellstes Neutral hinzu; [Markenfarben wählen](https://gradiently.design/de/guide/how-to-choose-brand-colors) hilft dabei.
3. **Leg deine Schriften fest.** Wähle eine Schrift für Überschriften und eine für Fließtext oder [lade deine eigenen Schriftdateien hoch](https://gradiently.design/de/guide/custom-fonts-upload).
4. **Beschreib die Tonalität.** Eine Website-Beschreibung sagt dem Designer, was du bist, nicht wie du klingst. Fülle Tonfall, In deinen Worten, Immer und Nie aus; [Markenstimme für KI](https://gradiently.design/de/guide/brand-kit-voice) zeigt, wie.

Ein Instagram-Post, der Crumb vorstellt, eine Sauerteigbäckerei, mit Name und Beschreibung von ihrer Website

Ein erster Post direkt nach dem Import: Name und Beschreibung von der Website.

Dieselbe Vorstellung von Crumb als vertikale Instagram-Story

Dieselbe Marke als Story in 1080×1920, bereit, sobald das Kit steht.

## Wenn das Lesen einer Website scheitert

Siehst du **Wir konnten diese Website nicht lesen.**, hat die Seite nicht rechtzeitig geantwortet, einen Fehler zurückgegeben oder die Anfrage blockiert. Prüfe, ob sich die Adresse in einem privaten Browserfenster öffnet. Adressen, die auf ein privates Netzwerk, eine Login-Seite oder eine Datei statt einer Webseite zeigen, werden absichtlich abgelehnt. Eine Website hinter einer strengen Bot-Sperre lässt sich vielleicht nie lesen; tipp die Angaben dann von Hand ein, das dauert ein paar Minuten.

> **Wer das kann** Eine Website zu lesen gehört zum Markenkit, das in Pro enthalten ist. In einem geteilten Arbeitsbereich können nur Inhaber und Admins ein Markenkit ändern. Gradiently liest die Website einmal, wenn du es veranlasst, ohne Cookies oder Zugangsdaten.

Mit ausgefülltem Kit stellt das Studio deine Farben in jedem Farbwähler an den Anfang, bietet deine Logos an und startet Designs in deinen Schriften, und der Designer schreibt auf Basis deiner Beschreibung. Kombiniere das mit einem Mark, den niemand sonst nutzen kann, und deine Posts sehen vom ersten an nach dir aus. Den Rest des Kits behandelt [Markenkit einrichten](https://gradiently.design/de/guide/brand-kit-setup).

## FAQ

### Wie bekomme ich meine Markenfarben von meiner Website?

Gib in Gradiently auf der Seite Marke deine Website ein und wähle Website lesen. Hat deine Website ein theme-color-Tag, wird seine Farbe als Markenfarbe angeboten.

### Warum hat Website lesen mein Logo nicht gefunden?

Es sucht nach Raster-Icons wie einem apple-touch-icon oder favicon.ico und überspringt SVG-Icons. Ergänze ein PNG-Touch-Icon auf deiner Website oder lade dein Logo direkt hoch.

### Überschreibt der Import mein Markenkit?

Nein. Jeder Fund wird als Vorschlag angeboten, und im Kit ändert sich nichts, bis du ihn übernimmst.

### Kann ich eine Marke von der Website eines anderen importieren?

Das Tool liest jede öffentliche Website, aber nutze es für Marken, die du führst oder für die du arbeitest. Ins Kit gehören Assets, die du verwenden darfst.

### Was, wenn meine Website keine Beschreibung hat?

Website lesen bietet trotzdem an, was es findet. Schreib Slogan und „Über uns“ von Hand und ergänze am besten eine Meta-Description auf der Website, das hilft auch in den Suchergebnissen.
