Telegram, WhatsApp+380637610482
Valery Danyuk
Valery DanyukpromoteurDéveloppement d'outils d'IA pour les entreprises. Haute qualité. Prix abordables.Écrire sur Telegram
Slash — un aperçu d'un site dans ce style

Slash

Chambre forte de minuit avec des livres de comptes dorés

Slash fonctionne en mode galerie nocturne: un fond presque noir, des caractères blancs et une unique touche de cuivre chaud faisant office de ponctuation. Les titres s’affichent en Ivy Presto, une police didone à empattements à fort contraste utilisée dans des tailles extrêmes (jusqu’à 88 px); ce contraste entre polices à empattements et sans empattements est la signature du système, lui conférant une gravité financière sans l’aura de courtage des banques traditionnelles. Le reste de l’interface utilisateur est volontairement sobre: bordures fines, commandes en forme de pilule, texte courant compact de 16 px et une légère inclinaison vers le haut pour aérer le texte. Un unique dégradé doré (ligne de graphique, micro-accents) réchauffe le système monochrome, évoquant la douce lueur d’un terminal Bloomberg conçu pour un public de designers.

Le contenu, d'une largeur de 1216 px, est centré et comporte des gouttières verticales de 160 px. L'écran d'accueil est une page sombre occupant toute la largeur, avec une composition divisée: un en-tête à empattements aligné à gauche (64 à 88 px de large) avec un champ d'adresse e-mail en dessous, et une grande carte d'interface produit (une capture d'écran du tableau de bord) à droite, occupant 50 % de la largeur. Les sections suivantes utilisent un en-tête centré sur une seule colonne (empattement, 44 à 64 px de large) avec un sous-titre en intercalaire, suivi de grilles à trois colonnes de cartes pour les descriptions de fonctionnalités, les témoignages et les articles de blog. La navigation est assurée par une barre supérieure fixe: logo à gauche, menu central (Entreprise, Produits, Solutions, Clients, Tarifs, FAQ), connexion discrète alignée à droite et « Premiers pas» (élément blanc). Le pied de page présente une grille dense à cinq colonnes de liens contenant des informations sur l'entreprise et des mentions légales. La page alterne entre des sections de grille riches en contenu et des statistiques en plein écran; le rythme est établi par le généreux espace blanc entre les colonnes plutôt que par l’alternance des couleurs de fond (la page entière est présentée comme une seule et même toile unifiée).

Les photographies, de style éditorial et naturaliste, présentent des portraits chaleureux des fondateurs et des membres de l'équipe dans leur environnement de travail quotidien (bureaux, salons, chantiers). Les images remplissent entièrement les cadres des cartes, sans marge. Un dégradé foncé est utilisé en bas des témoignages pour améliorer la lisibilité du texte. L'esthétique, à mi-chemin entre LinkedIn et un magazine, est décontractée, humaine et légèrement sobre, jamais retouchée avec des photos d'illustration classiques. Les vignettes des articles associent des photographies à des illustrations (une personne dans un labyrinthe, une cheminée avec des liasses de billets). L'interface utilisateur du produit s'affiche en mode sombre avec une opacité totale, flottant au-dessus de la page sur des surfaces sombres subtiles: un élément central. Les icônes sont monochromes, avec un contour de 1 px en #2e3038 ou #777a88, jamais remplies de la couleur de la marque.

Palette

Neutre

  • Bone #e2e3e9 — Police de grande taille pour le texte principal, étiquettes de données détaillées et tonalité de texte standard pour la plupart des éléments d'interface utilisateur.
  • Obsidian #08080a — La toile de la page, le fond du pied de page, la surface la plus sombre est presque noire avec une subtile teinte bleue.
  • Onyx #040406 — La surface de la carte, le fond supplémentaire, est légèrement plus épaisse que la page pour un effet visuel.
  • Carbon #121317 — Panneaux en relief, interface utilisateur discrète: une première étape résolument plus légère dans l’évolution de Surface Stack.
  • Graphite #1c1d22 — Bordures, séparateurs, conteneurs d'icônes, curseurs de contrôle: la nuance de couleur la plus subtile qui définit la structure.
  • Slate #2e3038 — Bordures supplémentaires, icônes aux contours discrets, séparateurs subtils entre les blocs de contenu.

Typographie

de 13 à 88 px · 9 étapes

  • Ivy Presto — remplacement: Playfair Display · grandes lignes 400, 500 · Une police à empattements pour les titres et sous-titres — utilisée exclusivement pour les titres et les en-têtes de section à partir de 28 px. Ses traits didone à fort contraste et ses empattements fins lui confèrent une allure élégante et raffinée; son faible espacement positif de 0,01 em entre les lettres est inhabituel et lui donne un aspect imprimé, évoquant la comptabilité. Cette police à empattements est l'élément central de l'identité visuelle de la marque: elle distingue Slash de toutes les autres entreprises fintech SaaS qui utilisent par défaut des polices sans empattements géométriques.
  • Inter — remplacement: Inter (self-hosted via Google Fonts) · grandes lignes 300, 400, 500, 600, 700 · Police UI Sans: texte principal, navigation, boutons, étiquettes, liens, champs de formulaire et sous-titres. Le texte principal utilise une police de taille 300 pour les textes secondaires discrets; la police 500 est utilisée pour les textes d’importance moyenne et les étiquettes des boutons; la police 600 est réservée aux étiquettes de catégories en petites capitales. L’espacement négatif des lettres diminue de 2 (-3) et diminue à mesure que la taille diminue, ce qui est typique de la mise à l’échelle optique de la police Inter.

Intervalles et forme

ButSignification
Densitéspacieux
Étape de base8px
Rayon du bouton9999px
Rayon de la carte10px
Ombresnon - des bordures à la place des ombres
Entre les sections160px
Largeur de la page1216px

L'IA construira votre site web dans le style Slash et le remplira.

  • Partagez vos produits et publications via le lien - Instagram, TikTok, Facebook.
  • Transférez le contenu de votre ancien site: il vous suffit de préciser l’adresse.
  • Conception moderne sur le meilleur moteur: React ( Next.js) avec rendu côté serveur et optimisation SEO intégrée.
  • Optimisation SEO entièrement automatisée pour les résultats de recherche et recommandations de réseaux neuronaux.

Styles similaires

  • Modal — Un terminal phosphorescent dans une salle serveur plongée dans l'obscurité - la seule source de lumière est d'un vert éclatant
  • AgentQL — Aurores boréales au-dessus du terminal la nuit
  • GitHub — Un panneau de commande spatial doté de points de contrôle bioluminescents — un espace de travail sombre et atmosphérique où une unique lueur verte indique la voie à suivre.
  • Doppler — L'éclairage violet du coffre-fort à minuit. La toile presque noire brille d'un unique signal lavande et d'une lumière verte de confirmation; chaque surface est suffisamment incurvée pour être saisie.
  • Basedash — Un terminal informatique nocturne à la police mate. Un observatoire obscur où les indicateurs brillent de violet et de vert, les titres à empattement flottent au-dessus du bruit ambiant, et les boutons blancs en forme de pilule sont les seuls éléments lumineux dans une pièce aux surfaces noires et douces.
  • Superwhisper — Les aurores boréales se fondent sur le verre de minuit
  • Better Stack — Console Midnight SRE
  • Langbase — Console Midnight Northern Lights
  • Astro — Centre de contrôle des missions spatiales lointaines avec une unique lueur violette provenant d'une nébuleuse
  • Wayfinder — Un écran noir avec un titre à peine audible flottant au-dessus d'une illustration animée. L'interface se présente sous la forme d'un curseur de luminosité plutôt que d'un panneau de contrôle.
  • HashiCorp — La salle de contrôle à minuit, éclairée par des néons violets, est une surface technique sombre où un cube hexagonal lumineux sert de seule référence de couleur.
  • Umbrel — Un foyer chaleureux dans la salle des serveurs la nuit — une pièce sombre où une simple lueur pêche met en valeur ce qui compte vraiment.