# Merk importeren van je website: vul je merkkit in één stap
[Canonical HTML page](https://gradiently.design/nl/guide/import-brand-from-website)
Je website kent je naam, je pitch in één regel, je kleur en je icoon al. Eén knop op de Merkpagina leest ze uit en jij beslist wat je houdt.
## The short version
- Gradiently kan de website van een merk lezen en biedt de naam, beschrijving, themakleur en het icoon aan voor de merkkit.
- Er wordt niets automatisch toegevoegd: elke bevinding verschijnt als suggestie die je kunt gebruiken of negeren.
- De naam komt uit de eigen naamtags van de site, de beschrijving uit de metabeschrijving, de kleur uit de theme-color-tag en het icoon uit het touchicoon of de favicon.
- Een site zonder theme-color-tag of met alleen een SVG-icoon geeft minder suggesties, dus een paar regels in de HTML-head verbeteren het resultaat.
- Een website lezen hoort bij de merkkit, die bij Gradiently Pro zit.
Om je **merk van je website te importeren** in Gradiently open je de Merkpagina, typ je je adres bij **Website** onder Identiteit en kies je **Site lezen**. Gradiently haalt de naam, beschrijving, themakleur en het icoon van de site op en biedt ze elk aan: gebruik de naam, gebruik de beschrijving als slogan of bij Over, voeg de kleur toe aan je merkkleuren, voeg het icoon toe als logo. Jij kiest wat erin gaat. Het kost een paar seconden en scheelt het saaiste deel van het inrichten van een kit.
## Zo importeer je je merk van een website
1. **Open de Merkpagina** Kies het merk dat je wilt invullen. Elk merk in je account heeft een eigen kit, dus zorg dat je in de juiste zit.
2. **Vul de website in** Typ onder **Identiteit** het adres bij **Website**. Een gewoon domein zoals `crumb.co` is genoeg; je hebt https niet nodig.
3. **Kies Site lezen** Gradiently bezoekt de pagina één keer, leest de head en haalt het icoon op. De knop toont **Lezen…** terwijl het bezig is.
4. **Gebruik wat past** Elke bevinding verschijnt met een eigen knop: **“Crumb” als naam gebruiken**, **Beschrijving als slogan gebruiken**, **Beschrijving gebruiken bij Over**, **Kleur toevoegen**, **Icoon als logo toevoegen**. Negeer wat niet klopt.
5. **Lees opnieuw na wijzigingen** Werk je je site bij, kies dan **Opnieuw lezen**. Staat alles wat nuttig is al in de kit, dan zegt de pagina dat.
De kleur van de site duikt later ook op als suggestie in het onderdeel **Kleuren**, gelabeld met de naam van je site, zodat je hem daar kunt toevoegen als je hem de eerste keer oversloeg.
## Wat Gradiently van je website leest
Het leest alleen de openbare homepage op het adres dat je geeft, en alleen de delen die het merk beschrijven. Het crawlt geen andere pagina’s, logt niet in en leest je inhoud niet.
| Suggestie voor de kit | Waar het vandaan komt | Wordt |
| --- | --- | --- |
| Naam | `og:site_name`, `application-name` of de titel van de Apple-webapp | Merknaam |
| Beschrijving | `meta name="description"`, of de Open Graph-beschrijving | Slogan of Over |
| Kleur | `meta name="theme-color"` als hex of rgb() | Een merkkleur |
| Icoon | Het grootste `apple-touch-icon`, andere rastericonen, dan `/favicon.ico` | Een logo, tot 256 px |
Vier suggesties en hun bronnen. Het icoon wordt opnieuw getekend als PNG van hooguit 256 px voordat Gradiently het bewaart.
Twee details zijn goed om te weten. SVG-iconen worden overgeslagen, omdat Gradiently de SVG van een ander niet rastert, dus een site met alleen een SVG-favicon geeft geen icoon. En de kleur moet een gewone hex- of rgb()-waarde zijn; een CSS-variabele in de theme-color-tag kan niet gelezen worden.
## Maak je website makkelijk leesbaar
Komt Site lezen magertjes terug, dan is de oplossing meestal een paar regels in de HTML-head van je site. Ze helpen meer dan alleen Gradiently: browsers gebruiken theme-color voor de adresbalk op telefoons en linkvoorbeelden gebruiken je Open Graph-tags. [Open Graph-tags](https://gradiently.design/nl/guide/open-graph-tags) en [favicon-ontwerp](https://gradiently.design/nl/guide/favicon-design) gaan dieper.
```html
Crumb · Sourdough bakery in Leeds
```
Alles waar Site lezen naar zoekt: een sitenaam, een beschrijving van één regel, een themakleur in hex en een raster-touchicoon van 180×180.
### Geeft weinig
- Geen metabeschrijving, of een volgestopt met zoekwoorden
- Geen theme-color-tag, of een CSS-variabele erin
- Alleen een SVG-favicon
- Een homepage die doorstuurt naar een inlogscherm
### Geeft een volledige kitstart
- Eén eerlijke zin over wat je doet
- Een themakleur in hex die bij je logo past
- Een touchicoon van 180×180 PNG
- Een openbare homepage die snel laadt
## Wat te doen na de import
De import geeft je een fundament, geen afgewerkte kit. Vier dingen zijn de moeite waard om daarna te doen, in deze volgorde.
1. **Upload echte logobestanden.** Een favicon is klein en vierkant. Voeg je volledige logo toe als PNG, JPEG, WebP, GIF of AVIF, een voor donkere en een voor lichte achtergronden; zie [logo op een gradiëntachtergrond](https://gradiently.design/nl/guide/logo-on-gradient-background).
2. **Rond de kleuren af.** Eén themakleur is een begin. Voeg een ondersteunende kleur toe en je donkerste en lichtste neutrale tinten; [merkkleuren kiezen](https://gradiently.design/nl/guide/how-to-choose-brand-colors) helpt.
3. **Stel je fonts in.** Kies een font voor koppen en een voor broodtekst, of [upload je eigen fontbestanden](https://gradiently.design/nl/guide/custom-fonts-upload).
4. **Schrijf de stem.** Een sitebeschrijving vertelt de Designer wat je bent, niet hoe je klinkt. Vul Toon, In je eigen woorden, Altijd en Nooit in; [merkstem voor AI](https://gradiently.design/nl/guide/brand-kit-voice) laat zien hoe.
Een Instagrampost die Crumb introduceert, een zuurdesembakkerij, met de naam en beschrijving uit de website
Een eerste post direct na de import: naam en beschrijving van de site.
Dezelfde Crumb-introductie als verticale Instagramstory
Hetzelfde merk als story op 1080×1920, klaar zodra de kit is ingesteld.
## Als het lezen van een website mislukt
Zie je **We konden die website niet lezen**, dan antwoordde de pagina niet op tijd, gaf een fout of blokkeerde het verzoek. Check of het adres opent in een privévenster. Adressen die naar een privénetwerk, een inlogpagina of een bestand in plaats van een webpagina wijzen, worden met opzet geweigerd. Een site achter een strikte botmuur is misschien nooit leesbaar; typ de gegevens dan met de hand in, wat een paar minuten kost.
> **Wie dit kan** Een site lezen hoort bij de merkkit, die bij Pro zit. In een gedeelde workspace kunnen alleen eigenaren en beheerders een merkkit wijzigen. Gradiently leest de site één keer, wanneer jij erom vraagt, zonder cookies of inloggegevens.
Met de kit ingevuld zet de Studio je kleuren bovenaan in elke kiezer, biedt je logo’s aan en begint ontwerpen in je fonts, en schrijft de Designer vanuit je beschrijving. Combineer het met een Mark die niemand anders kan gebruiken en je posts lijken vanaf de eerste op jou. De rest van de kit staat in [een merkkit opzetten](https://gradiently.design/nl/guide/brand-kit-setup).
## FAQ
### Hoe haal ik mijn merkkleuren van mijn website?
Vul in Gradiently je website in op de Merkpagina en kies Site lezen. Heeft je site een theme-color-tag, dan wordt die kleur aangeboden als merkkleur.
### Waarom vond Site lezen mijn logo niet?
Het zoekt naar rastericonen zoals een apple-touch-icon of favicon.ico en slaat SVG-iconen over. Voeg een PNG-touchicoon aan je site toe of upload je logo rechtstreeks.
### Overschrijft importeren mijn merkkit?
Nee. Elke bevinding wordt als suggestie aangeboden en er verandert niets in de kit tot jij kiest hem te gebruiken.
### Kan ik een merk importeren van andermans website?
De tool leest elke openbare site, maar gebruik hem voor merken die je runt of waarvoor je werkt. De kit moet materiaal bevatten waarvoor je gebruiksrecht hebt.
### Wat als mijn site geen beschrijving heeft?
Site lezen biedt nog steeds aan wat het vindt. Schrijf je slogan en Over met de hand en overweeg een metabeschrijving aan de site toe te voegen, wat ook helpt in zoekresultaten.