Textures

Paper Textures sans raccord

20 textures de surface répétables (plat) pour interfaces en mode clair — papier chaud, accent rouge rouille. SVG et PNG transparent en 1x/2x/4x.

  • ui
  • svg
  • png transparent
  • texture
  • sans raccord
  • carrelage
  • matériau
  • plat
  • plat
  • interface claire
  • minimaliste
  • casual
Planche montrant 20 textures de surface répétables (plat) de la famille Paper, disposés sur un damier de transparence avec leurs tailles en pixels inscrites en dessous
aperçu 1600×3907la transparence est montrée en damier

À propos de ce pack

Paper Textures sans raccord est un ensemble de 20 textures de surface répétables dessinés dans le style plat, où il n'y a ni contour ni ombrage d'aucune sorte. Il contient des surfaces de brique, de pierre et de carrelage, du bois, du tissu et du métal, de la terre, de l'herbe et du plâtre, et une carte de hauteur assortie pour chaque surface.

Ce sont des surfaces dessinées en vectoriel, pas des scans PBR photographiques, et autant le dire franchement : elles ne passeront pas pour un matériau photoréaliste sous une caméra physique. Ce à quoi elles servent, c'est au travail stylisé, aux fonds 2D, aux remplissages d'interface et à tout ce qui doit rester lisible une fois mis à l'échelle ou recoloré — des cas où un scan photo est de toute façon le mauvais outil.

La profondeur ne vient que d'une ombre douce en couches — trois passes empilées plutôt qu'un filtre de flou, parce que certains rastériseurs SVG mettent un flou à l'échelle de travers et que le PNG 4x sort en bavure. Tout le reste est d'une seule couleur pleine.

À l'intérieur de ce style, voici la lecture Paper : une interface en mode clair sur une palette papier chaud avec des accents rouge rouille, bâtie autour de un cadre à bordure unique, de boutons pilule entièrement arrondis en 140x44, de barres en bandes divisées en 10 segments et d'icônes au trait sur une grille de 24px. Ces mesures expliquent pourquoi deux familles peuvent partager un style artistique sans être interchangeables : le style décide comment un bord est tracé, les nombres décident à quoi sert l'interface.

Chaque motif qui traverse un bord est redessiné sur le bord opposé, ce qui constitue toute la difficulté d'une texture répétable et ce qu'il est facile de rater sans s'en apercevoir. Chaque surface est livrée avec une carte de hauteur en niveaux de gris pour qu'un shader puisse en dériver une carte de normales à l'intensité que la scène demande, plutôt que d'en cuire une à une intensité qui ne convient à rien.

Chaque sprite est livré en SVG modifiable et en PNG transparent à 1x, 2x et 4x : vous pouvez déposer les PNG directement dans un moteur ou ouvrir le vecteur et changer une couleur. Dessiné aux mêmes mesures que le reste de la famille Paper, ce qui veut dire que ce kit et le kit de panneaux Paper s'alignent sans qu'aucun des deux soit redimensionné. Convient bien aux interfaces minimalistes et mobiles.

Téléchargement

Lien direct · sans inscription · sans page d'attente
Télécharger ZIP1.3 MB

Ensemble complet — sources SVG, exports PNG en 1x/2x/4x, licence et readme

Fichiers inclus dans ce pack
FichierFormatPoidsTéléchargement
Ensemble complet — sources SVG, exports PNG en 1x/2x/4x, licence et readmeZIP1.3 MB Obtenir →
Mur de briques, dalle sans raccord, plat, SVG modifiableSVG8.2 kB Obtenir →

Comment l'utiliser

  1. Réglez le matériau pour se répéter sur les deux axes à la taille source ; la tuile est dessinée carrée, ce qui introduit un raccord est donc une échelle non uniforme, pas le dessin.
  2. Passez le fichier -height dans un nœud normal-from-height plutôt que de l'utiliser directement comme carte de normales — c'est une élévation en niveaux de gris, pas une normale RVB.
  3. Si vous avez besoin d'une variante, recolorez par teinte plutôt qu'en éditant le SVG ; les tons sont choisis pour survivre à un décalage de teinte sans que le joint ni le grain disparaissent.

Licence

Creative Commons Attribution 4.0 — Gratuit pour un usage commercial. Attribution obligatoire. Conditions complètes · Ce que cela veut dire en pratique

Ligne de crédit à copier
"Paper Textures sans raccord" by Oğuzhan Girgin, licensed under CC BY 4.0 — https://www.colorosse.com/assets/3d/textures/paper-textures