Palettes de couleurs bleu outremer : 20 combinaisons + hexadécimal

Bleu Ultramarine est un bleu profond et vif qui signale instantanément confiance, artisanat et polissage moderne. Il peut se sentir royal et dramatique, ou propre et minimal, selon les accents que vous y associez.

Vous trouverez ci-dessous 20 idées de palettes de couleurs bleu ultramarine prêtes à l'emploi avec des codes hexagonaux, ainsi que des conseils pratiques pour les utiliser dans le branding, l'interface utilisateur et l'impression.

Pourquoi les Palettes bleues ultramarines fonctionnent si bien

Le bleu Ultramarine se situe au point doux entre le classique et le contemporain: il est assez saturé pour se sentir haut de gamme, mais toujours assez propre pour les interfaces modernes. Cela en fait une couleur d'ancrage fiable pour tout, des sections héros à l'emballage.

Il s'associe naturellement à des accents chauds et frais. Ajoutez de l'or, de la crème et de la terre cuite pour le rendre luxueux et humain, ou combinez-le avec des blancs glacés, des gris ardoise et du cyan pour créer une ambiance nette et technologique.

Plus important encore, l'ultramarine maintient bien le contraste. Lorsque vous l'équilibrez avec les blancs cassés et les neutres foncés, vous obtenez une hiérarchie solide et une lisibilité sans avoir besoin d'un noir dur partout.

20+ Idées de Palette de couleur bleu Ultramarine (avec Codes hexagonaux)

1) Chute de nuit Ultramarine

hexagonal:#120A8F#0B1026#F5F1E8#C8A24A#E55D73

Humeur:Dramatique et luxueux

Meilleur pour:section Héros de marque de luxe

Spectaculaire et luxueux, il ressemble à des rideaux en velours, des garnitures dorées et un ciel nocturne avec une pointe de rouge. Utilisez le bleu profond comme ancre, puis ajoutez de la crème pour la pièce respiratoire et de l'or pour les signes premium. Il brille sur des pages de destination haut de gamme, des marques de parfum ou des visuels d'hôtels de boutique. Conseil: gardez le rose comme un petit accent pour les appels à l'action afin que le look reste raffiné.

Exemple d'Image de ultramarine nightfall généré en utilisant media.io

Media.io

Media.io est un studio d'IA en ligne pour la création et l'édition de vidéos, d'images et d'audio dans votre navigateur.

Essayez-le maintenant gratuitement

2) Ardoise océanique

hexagonal:#1A2B8A#2F3A4A#8FA3B8#E7EDF4#F2A65A

Humeur:Calme et professionnel

Meilleur pour:ui du tableau de bord saas

Calme et professionnel, il se lit comme de l'eau ouverte sous un ciel nuageux avec une bouée chaude d'orange. Associez ardoise et ultramarine pour la navigation et les boutons primaires, puis appuyez-vous sur le gris-bleu pâle pour les arrière-plans. Il fonctionne particulièrement bien pour les analyses, les outils d'administration et les produits B2B qui ont besoin de clarté sans avoir l'air froid. Astuce: Réservez l'orange pour les alertes ou les indicateurs clés afin qu'il reste significatif.

Exemple d'Image d'ardoise océanique générée en utilisant media.io

3) Porcelaine et Ultramarine

hexagonal:#1D1FA3#FFFFFF#F3E7D3#B9C7E6#2A2A2A

Humeur:Romantique et clair

Meilleur pour:suite d'invitation de mariage

Romantique et clair, il évoque la porcelaine peinte, les vœux écrits à la main et la douce lumière des bougies sur le lin. La palette de couleurs bleu ultramarine est intemporelle sur les invitations lorsque vous équilibrez le bleu audacieux avec beaucoup de blanc et une touche de crème chaude. Utilisez le charbon de bois pour le type lisible et le périwinkle pâle comme bordure délicate ou remplissage monogramme. Astuce: Choisissez des textures de papier non revêtues pour éviter que le bleu ne soit trop brillant.

Exemple d'Image de porcelaine et ultramarine générée en utilisant media.io

4) Bleu Arcade néon

hexagonal:#2A00FF#101225#00E5FF#FF2D95#EDEDED

Humeur:Audacieux et futuriste

Meilleur pour:Superposition de flux de jeu

Audacieux et futuriste, il ressemble à une lueur d'arcade, des rythmes de synthèse et des réflexions sur le verre sombre. Gardez l'arrière-plan presque noir, puis couchez ultramarine et cyan pour les panneaux, les cadres et les badges de statut. Magenta fonctionne mieux comme un accent de pouls pour les alertes, les nouveaux abonnés ou les indicateurs en direct. Astuce: Utilisez le gris clair pour les petites étiquettes afin que la lisibilité reste élevée sans laver l'ambiance néon.

Exemple d'Image de neon arcade blue généré avec media.io

5) Musée de la côte

hexagonal:#1627B8#0F172A#D7E3F1#9DB6C8#D9A441

Humeur:Culturé et nautique

Meilleur pour:Signalisation des expositions du musée

Culturé et nautique, il rappelle les cartes maritimes, le laiton poli et l'éclairage silencieux de galerie. Ultramarine et presque noir font de solides en-têtes, tandis que les bleus brumeux gardent les panneaux lisibles. Le laiton-or est parfait pour les marqueurs de section ou les numéros d'exposition sans se sentir flashy. Conseil: Gardez le texte du corps sur le fond pâle et évitez les grands blocs d'or pour maintenir une retenue semblable à un musée.

Exemple d'Image de coastal museum généré en utilisant media.io

6) Contraste Pop agrumes

hexagonal:#1B2AE0#F7F7F2#FFB000#3A3A3A#A7B4D6

Humeur:Énergique et propre

Meilleur pour:Modèles de promotion de médias sociaux

Énergique et propre, il ressemble à des agrumes frais sur un comptoir blanc croustillant avec un bord bleu vif. Ces combinaisons de couleurs bleues ultramarines sont idéales lorsque vous voulez une attention instantanée sans utiliser de rouges forts. Utilisez ultramarine pour les titres et les cadres, puis laissez orange diriger le CTA principal. Astuce: Gardez le gris moyen pour le texte de support afin que la mise en page reste soignée et moderne.

Exemple d'Image de citrus pop contraste généré à l'aide de media.io

7) Encre et parchemin

hexagonal:#1417A6#2B2B2B#F2E8D8#B6A48A#8FA6C9

Humeur:Classique et éditorial

Meilleur pour:magazine feature spread

Classique et éditorial, il ressemble à l'encre sur papier texturé avec une légère chaleur antique. Ultramarine fait des guillemets de traction et des diviseurs de section frappant, tandis que le parchemin et le bronzage gardent les mises en page accessibles. Il convient aux articles longs, aux portfolios et aux lookbooks qui ont besoin de sophistication sans se sentir rigide. Astuce: Utilisez le bleu doux pour les petites règles et les légendes pour guider l'œil tranquillement.

Exemple d'Image d'encre et de parchemin généré à l'aide de media.io

8) Ciel d'hiver Minimal

hexagonal:#1A33CC#EAF1FF#FFFFFF#B9C9E6#111827

Humeur:minimal et aéré

Meilleur pour:logo minimaliste et kit de marque

Minimal et aéré, il suggère de la lumière froide du soleil, de la neige propre et des ombres nettes sur la glace. Utilisez ultramarine pour une seule marque ou icône forte, puis gardez la plupart des surfaces brillantes avec du blanc et du bleu pâle. Le presque noir est idéal pour la typographie et les directives de marque qui nécessitent un contraste nett. Astuce: limitez les dégradés et laissez les formes plates faire le travail pour une sensation vraiment moderne.

Exemple d'Image de winter sky minimal généré en utilisant media.io

9) Fleur botanique d'Indigo

hexagonal:#1C2BC7#2E3A59#F7F2EA#7DB6A6#E9A6B6

Humeur:Doux et botanique

Meilleur pour:illustration florale aquarelle

Doux et botanique, il rappelle les pétales pressés, le colorant indigo et une matinée calme en serre. Utilisez le bleu profond pour les tiges, les contours ou les ombres, puis équilibrez-le avec des tons de papier crème. Sage et blush ajoutent une touche douce et moderne qui semble fait main plutôt que vintage. Conseil: Gardez les transitions de couleur aqueuses et imparfaites pour préserver le charme de l'aquarelle.

Exemple d'image d'une floraison botanique indigo générée avec media.io

10) Tech Conference Pulse

hexagonal: #1829F0 #0A0F1F #E6ECFF #6EE7FF #FFC857

Humeur: sûr de soi et plein d'énergie

Meilleur pour: affiche et flyer de conférence

Sûr de soi et plein d'énergie, cela évoque les projecteurs du keynote et des flux de données rapides. Construisez la base avec du bleu très foncé presque noir et de l'outremer, puis ajoutez du cyan pour les lignes de mouvement et des détails façon interface. Le jaune chaud fonctionne le mieux pour la date, le lieu ou les boutons billets afin que les infos clés ressortent. Astuce : Gardez la typographie grande et alignée sur une grille pour éviter la pollution visuelle.

Exemple d'image du style tech conference pulse générée avec media.io

11) Indigo Denim Days

hexagonal: #1A2AA8 #35424A #D9D2C3 #FFFFFF #C46D5E

Humeur: décontracté et ancré

Meilleur pour: page d’accueil d'une marque de vêtements

Décontracté et ancré, cela évoque un denim usé, des sacs cabas en toile et de chaleureux détails terracotta. Cette palette bleu outremer fonctionne bien pour les marques lifestyle lorsqu’on veut un bleu accessible, non corporate. Associez le bleu à du blanc cassé et du sable pour les fonds, puis utilisez la terracotta pour les badges ou étiquettes promotionnelles. Astuce : utilisez beaucoup d’espaces blancs et une typographie spontanée pour garder l’esprit denim détendu.

Exemple d'image du style indigo denim days générée avec media.io

12) Ceramic Tile Kitchen

hexagonal: #1830B5 #F6F4EF #C7D2E9 #8DA2B8 #7A5C4A

Humeur: chaleureux et raffiné

Meilleur pour: moodboard de design intérieur

Chaleureux et raffiné, cela rappelle des carreaux de céramique brillants, du bois chaleureux et de la lumière naturelle douce. Utilisez l’outremer comme teinte forte, puis superposez des crèmes et gris froids pour garder l’espace aéré. Le brun ancre la palette, idéal pour le mobilier ou les étiquettes matériaux. Astuce : traitez le bleu comme un mur accent ou une crédence, pas comme une peinture générale.

Exemple d'image du style ceramic tile kitchen générée avec media.io

13) Deep Space Onboarding

hexagonal: #1B24FF #0B1020 #1F2A44 #B9C7FF #F4F6FF

Humeur: élégant et immersif

Meilleur pour: écrans d'onboarding application mode sombre

Élégant et immersif, cela suggère une interface de vaisseau spatial où des lueurs douces croisent l’ombre profonde. Utilisez l’outremer vif pour les actions principales et les indicateurs de progression, tandis que le bleu marine et anthracite servent pour les couches de fond. Le pervenche pâle et le quasi-blanc assurent la lisibilité sans briser l’ambiance sombre. Astuce : Ajoutez seulement de subtils dégradés sur les petites surbrillances pour éviter l’effet de bandes sur les écrans OLED.

Exemple d'image du style deep space onboarding générée avec media.io

14) Maritime Flagship

hexagonal: #1227D5 #0E1A2B #FFFFFF #BFD2EA #E0B44C

Humeur: net et marin

Meilleur pour: header de site nautique

Net et marin, cela évoque les pavillons de signalisation, le métal poli et une ligne d’horizon claire. L’outremer et le bleu marine forment un header et une navigation solides, tandis que le blanc assure un esprit aéré. Une petite touche dorée ajoute un aspect patrimonial sans rendre l'ensemble trop formel. Astuce : Utilisez le bleu pâle pour les états de survol et les séparateurs subtils pour la légèreté.

Exemple d'image du style maritime flagship générée avec media.io

15) Royal Velvet Cosmetics

hexagonal: #1A21B8 #2B0F2F #F6E9F0 #D6B2C6 #D4AF37

Humeur: glamour et opulent

Meilleur pour: publicité pour cosmétique

Glamour et opulent, cela évoque des emballages en velours, des notes de parfum et une finition douce effet poudre. Fondez le décor avec de l’outremer et du prune pour un fond riche, puis travaillez le rose et le mauve pour une typographie délicate et les surbrillances. L’or paraît premium utilisé en petite quantité sur les bouchons, sceaux ou filets. Astuce : gardez un éclairage doux et directionnel pour que les couleurs sombres soient luxueuses, pas ternes.

Exemple d'image du style royal velvet cosmetics générée avec media.io

16) Finance Clarity

hexagonal: #1626C9 #111827 #F9FAFB #C7D2FE #10B981

Humeur: fiable et limpide

Meilleur pour: graphiques de rapport annuel

Fiable et limpide, cela fait penser à des tableaux bien ordonnés, des impressions nettes et une prise de décision sereine. Utilisez l’outremer pour les séries principales des graphiques, puis le vert menthe pour les marqueurs de croissance ou KPIs clés. Le quasi-noir et le quasi-blanc assurent la lisibilité et le professionnalisme des tableaux. Astuce : gardez les quadrillages légers et laissez le bleu jouer le rôle principal dans la hiérarchie.

Exemple d'image du style finance clarity générée avec media.io

17) Sunset Afterstorm

hexagonal: #1520D6 #2B2D42 #F8F3E7 #F77F5A #CDB4DB

Humeur: cinématographique et intense

Meilleur pour: pochette d’album

Cinématographique et intense, cela ressemble à une accalmie de tempête où la lumière chaude touche l’horizon. Ces associations d’outremer sont parfaites pour une identité musicale : l’orange apporte de l’émotion sans dominer le bleu. Utilisez le crème pour le nom de l’artiste ou la playlist, puis laissez le lavande adoucir la transition entre sombre et lumière. Astuce : gardez la typo simple et centrée pour que l’histoire couleur reste centrale.

Exemple d'image du style sunset afterstorm générée avec media.io

18) Playroom Primary Mix

hexagonal: #1E2BFF #FFD166 #06D6A0 #EF476F #F8F9FA

Humeur: ludique et vif

Meilleur pour: illustration de couverture de livre enfant

Ludique et vif, cela ressemble à des blocs de construction, du papier créatif et une énergie après l’école. Utilisez l’outremer pour le titre principal, puis alternez le jaune, vert et rose pour les personnages ou formes. Idéal pour l’enseignement ou les marques enfants qui veulent de la sympathie instantanée. Astuce : limitez les contours et misez sur de grands aplats pour un look moderne et propre.

Exemple d'image du style playroom primary mix générée avec media.io

19) Architectural Blueprint

hexagonal: #0F1FDB #0B1220 #E8EEF9 #9FB2D0 #6B7280

Humeur: précis et moderne

Meilleur pour: présentation portfolio architecture

Précis et moderne, cela évoque les plans d’architecte, des mesures claires et des boards de présentation propres. L’outremer sublime les titres de section et les traits de diagrammes, tandis que les tons froids gardent les pages légères. Ajoutez du gris pour les légendes et métadonnées afin d’offrir une sensation technique mais soignée. Astuce : gardez les largeurs de trait régulières, et ne réservez le bleu vif qu’aux appels clés.

Exemple d'image du style architectural blueprint générée avec media.io

20) Soft Lavender Dusk

hexagonal: #1C2AE8 #2A2A3A #F5F3FF #C7B8FF #F2B5D4

Humeur: doux et onirique

Meilleur pour: landing page bien-être

Doux et onirique, cela rappelle les ciels du crépuscule et une routine apaisante. Utilisez l’outremer pour les boutons et headers principaux, puis le lavande et le rose pour une touche émotionnelle relaxante. Le fond blanc cassé rend le tout respirant, idéal pour les longues pages. Astuce : Ajoutez des éléments UI arrondis et de larges espaces pour renforcer le ton détendu.

Exemple d'image du style soft lavender dusk générée avec media.io

Quelles couleurs vont bien avec le bleu Ultramarine?

Les neutres chauds (crème, parchemin, sable) rendent l’outremer plus tactile et premium, idéal en design éditorial ou packaging. Les tons métallisés comme le laiton ou l’or amplifient aussi son aspect royal utilisés par touches.

En design digital, l’outremer s’associe parfaitement aux gris froids et quasi-noir pour une structure forte mais douce. Ajoutez cyan ou pervenche pour une vibe futuriste "interface" tout en gardant la palette cohérente.

Pour un contraste émotionnel, essayez corail, terracotta, rose ou lavande doux. Ces accents du chaud au pastel gardent l’outremer intense mais apportent une touche conviviale et expressive.

Comment utiliser une Palette de couleurs bleu Ultramarine dans des modèles réels

Commencez par décider si l’outremer est votre fond ou votre accent. En fond, gardez une typo claire (blanc cassé ou pervenche pâle) et limitez les accents saturés à une couleur "signal" pour les CTA.

En UI, assignez l’outremer aux actions principales et la navigation, puis les gris et teintes douces pour les surfaces, cartes et séparateurs. Cela préserve la hiérarchie et évite l’effet "tout crie" que peut causer un bleu saturé.

En impression, testez sur le papier prévu : non-couché, l’outremer s’adoucit joliment tandis qu’un brillant l’intensifie. Prévoyez du gris moyen ou charbon pour le texte courant et les détails fins.

Créez des visuels de Palette bleue Ultramarine avec l'IA

Si vous avez déjà des codes HEX, le plus rapide pour tester des layouts réels est de générer des maquettes : affiches, landing pages, packagings ou modèles sociaux. Voir l’outremer à grande échelle permet de valider contraste, ambiance et équilibre en quelques minutes.

Avec l’outil texte-image de Media.io, collez un prompt comme "section héros outremer avec espace négatif crème et accents or" et itérez rapidement jusqu’à trouver la bonne palette pour votre marque.

Une fois la direction trouvée, gardez des variantes : une version dark mode, une version light et une version très contrastée pour campagne. Cela offre flexibilité et cohérence web, app et print.

Suivant : Palette de couleurs gris foncé