# Discord-bannerformaten: server 960×540 en profiel 680×240 [Canonical HTML page](https://gradiently.design/nl/guide/discord-banner-size) Discord heeft drie banners, elk op een andere plek en in een andere vorm. Een staat boven je kanalenlijst, een verwelkomt mensen die je uitnodigt en een staat achter je eigen naam. Zo ontwerp je ze alle drie. ## The short version - Het formaat van de Discord-serverbanner is 960×540 pixels, een 16:9-afbeelding bovenaan de kanalenlijst van de server. - Het formaat van de Discord-profielbanner is 680×240 pixels, getoond achter je avatar op je profielkaart. - De uitnodigingsachtergrond van de server, soms de invite splash genoemd, is een 16:9-afbeelding die je het best op 1920×1080 ontwerpt. - Serverbanners en uitnodigingsachtergronden komen beschikbaar op Server Boost-niveaus en eigen profielbanners vereisen Discord Nitro. - Elke banner wordt deels bedekt door de interface van Discord, dus belangrijke details horen in de open vlakken en niet bij de randen. Het **Discord-bannerformaat** hangt af van welke banner je bedoelt. Een serverbanner is 960×540 pixels, een 16:9-afbeelding bovenaan de kanalenlijst van je server. Een profielbanner is 680×240 pixels en staat achter je avatar op je profielkaart. De uitnodigingsachtergrond van de server, getoond aan mensen die een uitnodigingslink openen, is ook 16:9 en ziet er het best uit op 1920×1080. Elk wordt deels bedekt door de interface van Discord, dus ontwerp ze als sfeer waarbij het belangrijke deel vrij blijft. ## Discord-bannerafmetingen in één oogopslag | Banner | Formaat | Verhouding | Beschikbaar met | | --- | --- | --- | --- | | Serverbanner | 960×540 px | 16:9 | Server Boost-niveau 2 | | Uitnodigingsachtergrond | 1920×1080 px | 16:9 | Server Boost-niveau 1 | | Profielbanner | 680×240 px | 17:6 | Discord Nitro | Boost-niveaus en Nitro-voordelen worden door Discord bepaald en veranderen van tijd tot tijd. Kijk in Serverinstellingen of je profielinstellingen wat voor jou beschikbaar is. - Serverbanner 960×540: 960 × 540 - Uitnodigingsachtergrond 1920×1080: 1920 × 1080 - Profielbanner 680×240: 680 × 240 De drie Discord-banners op schaal getekend. De serverbanner en de uitnodigingsachtergrond delen een vorm; de profielbanner is een korte strook. Exporteer PNG voor beelden, tekst en verlopen, JPEG voor foto’s. Geanimeerde banners gebruiken GIF en vereisen een hoger boost-niveau voor servers of Nitro voor profielen; maak je er een, houd de beweging dan langzaam, want de banner staat naast mensen die lezen en typen. [GIF vs MP4](https://gradiently.design/nl/guide/gif-vs-mp4) legt uit waarom GIF’s zorgvuldige kleuren nodig hebben. ## Discord-serverbanner: 960×540 De serverbanner staat bovenaan de kanalenzijbalk, boven je lijst met kanalen. De zijbalk is smal, dus de banner wordt klein getoond en de servernaam en een menupijltje liggen over de bovenrand. Leden zien hem elke keer dat ze de server openen, waardoor het de meest bekeken afbeelding is die je op Discord hebt. - **Houd de bovenste strook rustig.** Ongeveer de bovenste 100 pixels dragen de servernaam in wit, dus een donkerdere of effenere bovenkant helpt de leesbaarheid. - **Zet afbeelding of woorden in het midden.** Door het bijsnijden en schalen in de zijbalk verdwijnt detail aan de randen. - **Sla kleine tekst over.** Op zijbalkformaat is alles onder ongeveer 60 pixels hoogte in je ontwerp van 960×540 onleesbaar. - **Laat hem in de zijbalk overlopen.** Een banner waarvan de onderrand donkerder wordt richting het donkere thema van Discord, zit in de interface in plaats van erop. Een Discord-serverbanner van 960 bij 540 voor Night Owls Book Club met de naam gecentreerd op een donker verloop Woorden in het midden, een rustige bovenkant voor de servernaam en een donkerdere voet die aansluit op de kanalenlijst. ## Discord-uitnodigingsachtergrond De uitnodigingsachtergrond vult het scherm achter de uitnodigingskaart als iemand je uitnodigingslink in een browser opent. De kaart zelf staat in het midden en toont je servericoon, naam en de knop Accepteren. Dat betekent dat het midden van je afbeelding grotendeels verborgen is. Ontwerp de uitnodigingsachtergrond als een volledig vlak van kleur of textuur, met detail naar de randen en hoeken geduwd, het omgekeerde van de meeste banners. ### Serverbanner - Klein getoond, in de zijbalk - Elke dag gezien door leden - Woorden of beeld in het midden - Bovenrand bedekt door de servernaam ### Uitnodigingsachtergrond - Groot getoond, schermvullend - Eén keer gezien, door nieuwkomers - Midden bedekt door de uitnodigingskaart - Detail aan de randen, midden effen - Donker midden, violette randen: `radial-gradient(ellipse at 50% 50%, #0b0b14 0%, #1e1b4b 45%, #6d28d9 80%, #c084fc 100%)` - Donker midden, smaragdgroene randen: `radial-gradient(ellipse at 50% 50%, #08130f 0%, #064e3b 50%, #10b981 90%, #6ee7b7 100%)` - Donker midden, gloeiende randen: `radial-gradient(ellipse at 50% 50%, #140a05 0%, #7c2d12 50%, #f97316 90%, #fdba74 100%)` Uitnodigingsachtergronden die rustig zijn in het midden, waar de kaart staat, en gloeien naar de randen die mensen echt zien. ## Discord-profielbanner: 680×240 Met Nitro kun je een profielbanner uploaden, getoond over de bovenkant van je profielkaart als iemand op je naam klikt. Je ronde avatar overlapt de linkeronderhoek en de kaart is smal, dus de banner werkt het best als kleur en textuur met eventueel detail rechts. Zonder Nitro kun je nog steeds een effen bannerkleur kiezen, die je het best op je avatar afstemt. Je profielbanner reist met je mee naar elke server waar je lid van wordt, dus kies iets dat bij allemaal past in plaats van de interne grap van één community. Een Discord-profielbanner van 680 bij 240 met het woord Lofi rechts en lege ruimte links Eén woord rechts, open ruimte links voor de avatar. Een Discord-profielbanner van 680 bij 240 met de tekst Pixelart en geduld op een zacht verloop Een korte regel in een rustige strook, ruim uit de buurt van de linkeronderhoek. ## Zo ontwerp je een bijpassende set Discord-banners 1. **Kies één achtergrondfamilie** Dezelfde kleuren of hetzelfde materiaal over serverbanner, uitnodigingsachtergrond, servericoon en rolkleuren. Een community die op één plek lijkt, voelt als één plek. 2. **Ontwerp eerst de uitnodigingsachtergrond** Op 1920×1080 is hij het grootst, dus hij bepaalt de look. Houd het midden effen. 3. **Maak de serverbanner ervan** Dezelfde achtergrond op 960×540, met de servernaam of een slogan in het midden en een rustige bovenrand. 4. **Controleer in donkere en lichte thema’s** De meeste leden gebruiken dark mode, maar niet allemaal. Een banner waarvan de randen naar een middentoon overlopen staat in beide goed; [dark mode design](https://gradiently.design/nl/guide/dark-mode-design) legt uit waarom. 5. **Bekijk op echt formaat** Open de server op een laptop en een telefoon. Als de woorden in de zijbalk niet lezen, schrap ze dan of maak ze groter. Gamingcommunities, studieservers en Discords van makers hebben baat bij hetzelfde idee: de server ziet eruit als het merk waar hij bij hoort. Ondersteunt je Discord een stream of kanaal, stem hem dan af op je [Twitch-streamerbranding](https://gradiently.design/nl/guide/twitch-streamer-branding) of [gamingkanaalbeelden](https://gradiently.design/nl/guide/gaming-channel-art). In Gradiently geeft één Mark je alle drie de Discord-formaten, voor elke vorm opnieuw gerenderd in plaats van bijgesneden, en met Pro pas je een ontwerp in één stap aan elk formaat aan. Woorden op de Mark blijven leesbaar omdat hij zich erachter kalmeert. Meer vormen staan in [formaten van socialmediabeelden](https://gradiently.design/nl/guide/social-media-image-sizes). ## FAQ ### Welk formaat heeft een Discord-serverbanner? 960×540 pixels, een 16:9-afbeelding. Hij komt beschikbaar op Server Boost-niveau 2. ### Welk formaat heeft een Discord-profielbanner? 680×240 pixels. Voor het uploaden van een eigen profielbanner is Discord Nitro nodig; zonder kun je een effen bannerkleur kiezen. ### Welk formaat heeft de Discord-uitnodigingsachtergrond? Het is een 16:9-afbeelding en 1920×1080 pixels geeft een scherp resultaat op grote schermen. Hij komt beschikbaar op Server Boost-niveau 1. ### Kan een Discord-banner geanimeerd zijn? Ja, als GIF, maar geanimeerde serverbanners vereisen een hoger boost-niveau en geanimeerde profielbanners Nitro.