Skip to content

Latest commit

 

History

History
425 lines (278 loc) · 13.8 KB

README_fr.md

File metadata and controls

425 lines (278 loc) · 13.8 KB
Raw

English · 한국어


À la recherche des traducteurs pour cette README.

Il y a un Générateur qui vous permet de créer des images simples. Cependant, nous y suggérons lire le ce document entier pour mieux comprendre cette logicielle.

Navigation

  1. Utilisation
  2. Types
  3. Couleur
  4. Liste de Couleurs Personnalisé
  5. Thème
  6. Section
  7. Renversement
  8. Hauteur
  9. Texte
  10. Description
  11. Arrière-plan du texte
  12. Animation du texte
  13. Couleur du texte
  14. Grandeur du texte
  15. Position horizontal du texte - X
  16. Position vertical du texte - Y
  17. Grandeur du description
  18. Position horizontal de la description - X
  19. Position vertical de la description - Y
  20. Rotation
  21. Trait du texte
  22. Grandeur du trait
  23. Exemples

Avez-vous des idées pour le projet ? -> Soumettre un Idée Soumettre un Changement -> PR

Utilisation

https://capsule-render.vercel.app/api?

Simplement ajoute les paramètres au fin du URL. Comme ceci :

Markdown:

![header](https://capsule-render.vercel.app/api?type=wave&color=auto&height=300&section=header&text=capsule%20render&fontSize=90)

HTML:

<img src="https://capsule-render.vercel.app/api?type=wave&color=auto&height=300&section=header&text=capsule%20render&fontSize=90" />

Types

Le paramètre &type= change la forme de l'arrière-plan. Les formes dont vous pouvez choisir sont, en term anglais:

Ajoute &type= au URL, suivi par la forme que vous voulez afficher.

![header](https://capsule-render.vercel.app/api?type=slice)

Couleur

Changer l'arrière-plan!

  • &color=auto : Couleur complétement aléatoire. Une liste de toutes les couleurs se trouve ici
  • &color=timeAuto : Couleur complétement aléatoire dépendent sur le temp.
  • &color=random : Couleur complètement aléatoire. Je ne sais pas le couleur qui s'affiche.
  • &color=gradient : Dégrade de couleur complétement aléatoire. Une liste de toutes les couleurs se trouve ici
  • &color=timeGradient : Dégrade de couleur complétement aléatoire demandent sur le temp.
  • &color=_hexcode : défaut(#B897FF) remplace _hexcode par le représentation hexadécimal d'un couleur spécifique.
  • &color=_custom_gradient : Dégrade de couleur personnalisé &color=0:EEFF00,100:a82da8, produira { 0%: 'EEFF00', 100%: 'a82da8' }. Example

Si vous utilise auto comme paramètre, il ne faut pas spécifier un couleur pour le texte avec fontColor.

![header](https://capsule-render.vercel.app/api?color=auto)

Si vous utilise un couleur seulement, il ne faut pas commencer le code hexadécimal avec un '#'

Quand utiliser timeAuto et timeGradient ?

Utilise timeAuto et timeGradient quand vous voulez utiliser le même Dégrade pour plusieurs sections

Liste de Couleurs Personnalisé

Vous pouvez personnalisée la liste de couleur qui sont afficher avec &color=auto et &color=gradient.

Premièrement ajoute &customColorList= au URL.

Choisie la palette que vous voulez et noter son valeur idx.

Par exemple, si les values idx sont 0, 2 et 3, ajouter &customColorList=0,2,3 au URL.

Si vous voulez utiliser un couleur plusieurs fois il faut ajouter plusieurs fois à l’URL : Par exemple: il est possible d'ajouter idx=2 plusieurs fois dans un série : &customColorList=0,2,2,2,2,3

![header](https://capsule-render.vercel.app/api?color=gradient&customColorList=0,2,2,5,30)

Thème

Vous pouvez utiliser une combinaison de couleur préfabriquer avec theme=.

Le thème vais prend priorité au-dessus de color et fontColor alors pour personnalisé le plus il faudra utiliser ces deux.

Vous pouvez voire la liste de thèmes dans le fichier pallete_theme.json.

![reversal](https://capsule-render.vercel.app/api?type=rect&text=RECT&fontAlign=30&fontSize=30&desc=Use%20theme&descAlign=60&descAlignY=50&theme=radical)

J'ajoute couramment des combinaison de couleur de cette projet Link:theme peut par peut.

Section

Le paramètre section= vous permette à inverser l'image.

  • &section=header : (défaut)
  • &section=footer

Ajoute &section= au url avec sois header ou footer pour indiquer la direction.

![footer](https://capsule-render.vercel.app/api?section=footer)

Renversement

Retourne l'image (et sa couleur) de gauche a doigt.

  • &reversal=false : (défaut)
  • &reversal=true
![reversal](https://capsule-render.vercel.app/api?type=slice&reversal=true&color=gradient)

Hauteur

Change la grandeur de l'image. Le valeur défaut est 120.

Ajoute &height= au URL.

![header](https://capsule-render.vercel.app/api?height=400)

Il ne faut pas ajouter px au mesurément.

Texte

Le texte primaire sur l'image.

Ajoute du texte avec &text= .

![header](https://capsule-render.vercel.app/api?text=Hello%World!)

Il ne faut pas utiliser des caractères spécial, comme '#', '&', '/', etc...

remplace les espaces avec %20 et les nouveaux linges avec -nl-.

Description

Une description additionnelle sur l’image.

Ajoute une description avec &desc= 

![header](https://capsule-render.vercel.app/api?height=400&text=Bonjour%20Tous!&desc=Bonjour%20capsule%20render)

Il ne faut pas utiliser des caractères spécial, comme '#', '&', '/', etc...

remplace les espaces avec %20 (espace seulement)

Arrière-plan du texte

L'arrière-plan du texte

Ajoute &textBG=true pour utiliser.

Si vous voulez agrandir l'arrière-plan,

ajoute %20 avant et après le texte. Ceci est par-ce-que l’arrière-plan est dépendu de la longueur du texte, et ajouter des espaces agrandit la longueur du texte.

![header](https://capsule-render.vercel.app/api?type=rounded&color=gradient&text=%20asdf%20&height=300&fontSize=100&textBg=true)

Animation du texte

Cree du mouvement dans le texte de votre image.

Ajoute &animation= pour utiluzer.

  • fadeIn : fondu 1.2s
  • scaleIn : agrandissement .8s
  • blink : clignoter .6s
  • blinking : clignotement 1.6s
  • twinkling : scintillement 4s
![header](https://capsule-render.vercel.app/api?text=capsule_render&animation=fadeIn)

Couleur du texte

Change le couleur du texte, le défaut est 000000.

Il ne faut pas inclure un # dans le code hexadécimal du couleur.

Ajoute &fontColor= après &text= dans l'URL.

![header](https://capsule-render.vercel.app/api?text=Hello%World!&fontColor=d6ace6)

Grandeur du texte

Change la grandeur du texte, le défaut est 70.

Ajoute &fontSize= après &text= dans l'URL.

![header](https://capsule-render.vercel.app/api?text=Hello%World!&fontSize=40)

Il ne faut pas ajouter px au grandeur.

Position horizontal du texte

Change le position horizontal (x) du texte. valeur entre 0 et 100

&fontAlign= : Le valeur défaut est 50 se trouve au milieux de l'image.

Dans le cas où il y a plusieurs lignes dans &text= , vous pouvez utiliser un &fontAlign= pour chaque ligne nouvelle et le changement de position vont être appuiera individuellement pour chaque ligne.

![header](https://capsule-render.vercel.app/api?text=Hello%World!&fontAlign=70)

Position vertical du texte

Change le position vertical (y) du texte Valeur entre 0 et 100

&fontAlignY= : Valeur défaut est 50 qui se trouve au milieu de l'image.

Au cas ou il y a plusieurs linges séparer par -nl-, vous pouvez spécifier un &fontAlignY= pour chaque nouvelle ligne et le changement de position vais être appuis individuellement pour chaque ligne.

![header](https://capsule-render.vercel.app/api?text=Hello%World!&fontAlignY=20)

Grandeur de la description

Changer la taille du description, le valeur défaut est 20.

Ajoute &descSize= après &desc= dans l'URL.

![header](https://capsule-render.vercel.app/api?text=Hello%World!&fontSize=40&desc=Desc&descSize=30)

Il ne faut pas specifier px

Position horizontal de la description

Change le position horizontal (x) de la description. Valeur entre 0 et 100

&descAlign= : Valeur défaut est 50 au centre de l'image.

![header](https://capsule-render.vercel.app/api?text=Hello%World!&fontAlign=70&desc=Desc&descAlign=20)

Position vertical de la description

Change le position vertical (y) du description. Valeur enter 0 et 100

&descAlignY= : Le valeur défaut est 60 qui se trouve au milieu de l'image.

![header](https://capsule-render.vercel.app/api?text=Hello%World!&fontAlignY=20&desc=Desc&descAlignY=40)

Rotation

Utilise &rotate= pour spécifier la rotation du texte.

Vous pouvez aussi utiliser les numéro négative.

Il est suggéré d'utiliser un nombre enter -360 et 360. zéro est le défaut.

![header](https://capsule-render.vercel.app/api?text=Hello%World!&fontSize=20&rotate=-30)

Trait du texte

Change le couleur du trait du texte

Ajoute &stroke= au fin de l’URL.

Il faut utiliser un code couleur hexadécimal sans '#'

![header](https://capsule-render.vercel.app/api?type=rect&height=200&text=Stroke%20Test&fontAlign=70&stroke=00FF00)

Quand vous utiliser ce paramètre, il est suggéré d'agrandir la traite avec strokeWidth.

Sans strokeWidth le grandeur du trait devient 0.

Grandeur du trait

Change la grandeur du trait du texte.

Ajoute &strodeWidth= au fin du URL.

Le valeur devrais être plus grand que 0.

![header](https://capsule-render.vercel.app/api?type=rect&height=200&text=Stroke%20Test&fontAlign=70&stroke=00FF00&strokeWidth=3)

Il est suggéré d’utiliser cette paramètre avec stroke

Sans stroke le couleur du trait devient 'B897FF'.

Examples

Wave

wave

Egg

egg

Shark

shark

Slice

slice

Rect

rect

Soft

soft

Rounded

rounded

Cylinder

cylinder

Waving

waving

Transparent

transparent

Venom

venom