User:Ju gatsu mikka/brouillon2/template:Communauté/Aide

From Wikimedia Commons, the free media repository
Jump to navigation Jump to search
Cette page utilisateur dans d’autres langues :
Icône du corps

Il est assez simple de réaliser un nouveau fichier d’icônes de personnalité politique. Les fichiers de base ont été optimisés afin d’être le plus léger possible et d’être conforme au recommendation du W3C en termes de code, nous vous invitons donc à utiliser un éditeur de texte plutôt qu’un logiciel de retouche d’image vectorielle autant que possible, notamment si la modification à apporter ne concerne qu'un changement de couleurs.

Comment créer une nouvelle icône de personnalité politique

[edit]

Pour le corps gris de l’icône, téléchargez le fichier ? politic personality icon.svg montré ci-contre. Lorsque vous ouvrez le document avec un éditeur de texte, vous verrez le code ci-dessous :


Code
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="250">
<defs>
<filter id="e"><feGaussianBlur stdDeviation="1"/></filter>
<filter id="f"><feGaussianBlur stdDeviation="2"/></filter>
<linearGradient id="k" x1="7" y1="167" x2="201" y2="167" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#999"/>
<stop offset="1" stop-color="#FFF"/></linearGradient>
<linearGradient id="p" x1="64" y1="138" x2="138" y2="123" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#EEE"/>
<stop offset=".2" stop-color="#BBB"/>
<stop offset=".8" stop-color="#FFF"/>
<stop offset="1" stop-color="#CCC"/></linearGradient>
<linearGradient id="q" x1="39" y1="29" x2="148" y2="101" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#777"/>
<stop offset=".6" stop-color="#CCC"/>
<stop offset="1" stop-color="#FFF"/></linearGradient>
</defs>
<g fill="none" stroke="#BBB" stroke-width="2">
<circle filter="url(#e)" cx="99" cy="70" r="61"/>
<g stroke-width="3">
<path filter="url(#f)" d="m56,113c-29,16-55,59-40,90 18,35 153,33 169,1 15-29 4-64-37-91z"/>
<path fill="url(#k)" stroke="#999" d="m53,110c-29,16-55,59-40,90 18,35 153,33 169,1 15-29 4-64-38-91z"/>
</g><g stroke-width="1">
<path fill="#c5c5c5" stroke="#CCC" d="m61,110 1,1c-2,2-6,2-7,8-15,18-29,43-39,84 12-47 27-74 44-94z"/>
<path fill="#b6b6b6" d="m137,113-1,2c17,17 34,40 46,82-11-42-26-66-44-84z"/></g>
<path fill="url(#p)" stroke="#DDD" d="m79,125c-4,4-9,6-8,17-11-5-18-14-14-29 7,5 14,9 23,12zm36,0c4,4 9,6 9,17 11-5 18-14 15-29-7,5-14,9-23,12z"/>
<circle fill="url(#q)" stroke="#999" cx="98" cy="68" r="60.5"/>
</g>
</svg>

Nous allons maintenant créer l’écharpe colorée en insérant entre l’avant-dernière ligne (</g>)et la dernière ligne (</svg>) du code précédent les éléments nécessaires.

Notez que, quelques soit votre cas de figure, si l’une des couleurs extérieurs est blanche, vous avez la possibilité de dessiner une bordure en ajoutant le code stroke="#DDD" aux directives du chemin.

Par ailleurs, vous pouvez également partir des fichiers exemples ci-après.

Écharpe à fond uni

[edit]

Dans ce premier cas, nous souhaitons obtenir une écharpe d’une seule couleur ou don le fond est uni. Ce premier cas peut également être utilisé comme « fond extérieur ».

Pour ce faire nous allons insérer le code suivant :


Code
<path fill="couleur_fond" d="M33,110c33.2,53 77.8,92 137.6,118.3l-21.6,19c-62-11-111-51-134-119.3z"/>

Écharpe à deux bandes égales

[edit]

Dans ce second cas, nous étudierons une écharpe constitué de deux bande de même largeur. Nous utiliserons le code suivant :


Code
<path fill="couleur_supérieure" d="M33,110c33,58 78,99 137.6,118.3l-10.8,9.5c-67-21-112-55-135.6-118.7z"/>
<path fill="couleur_inférieure" d="M24.3,118.8c32,79 79,99 135.6,118.7l-10.8,9.5c-62-11-111-51-134-119.3z"/>

Écharpe à trois bandes égales

[edit]

Dans ce troisième cas, nous nous intéressons à une écharpe constitué de trois bandes de même largeur. Deux possibilités s’offrent à nous :

  1. les trois bandes sont de couleurs différentes ;
  2. les bandes extérieures sont de même couleur.

Écharpe à trois bandes égales de trois couleurs

[edit]

Dans la première possibilité, nous utiliserons le code suivant :


Code
<path fill="couleur_supérieure" d="M33,110c33,53 78,93 137.6,118.3l-6.6,5.7c-50-11-112-60-136-119z"/>
<path fill="couleur_centrale" d="M28,115c28,58 69,99 136,119l-7.4,6.7c-67-21-112-55-135.6-118.7z"/>
<path fill="couleur_inférieure" d="M21,122c32,79 79,99 135.6,118.7l-7.6,6.6c-62-11-111-51-134-119.3z"/>

Écharpe à trois bandes égales de deux couleurs

[edit]

Dans la seconde, nous allons réutiliser le code de l’écharpe à fond uni auquel nous ajouterons le code de la bande centrale du code ci-dessus.


Code
<path fill="couleur_fond" d="M33,110c33.2,53 77.8,92 137.6,118.3l-21.6,19c-62-11-111-51-134-119.3z"/>
<path fill="couleur_centrale" d="M28,115c28,58 69,99 136,119l-7.4,6.7c-67-21-112-55-135.6-118.7z"/>

Écharpe à trois bandes égales séparées par un liseré

[edit]

Une petite variation du cas de l’écharpe à trois bandes égales est quand les trois bandes sont séparées par une quatrième couleur. Nous allons reprendre les codes vue ci-dessus, nous assurer que la bande centrale est placée en dernière et ajouter avant celle-ci le code du liseré comme dans suit :


Code
; Trois couleurs
<path fill="couleur_supérieure" d="M33,110c33,53 78,93 137.6,118.3l-6.6,5.7c-50-11-112-60-136-119z"/>
<path fill="couleur_inférieure" d="M21,122c32,79 79,99 135.6,118.7l-7.6,6.6c-62-11-111-51-134-119.3z"/>
<path fill="couleur_liserée" d="M29,113c28,58 69,99 136,119l-10,11c-67-21-112-55-134-119z"/>
<path fill="couleur_centrale" d="M28,115c28,58 69,99 136,119l-7.4,6.7c-67-21-112-55-135.6-118.7z"/>
Deux couleurs
<path fill="couleur_fond" d="M33,110c33.2,53 77.8,92 137.6,118.3l-21.6,19c-62-11-111-51-134-119.3z"/>
<path fill="couleur_liserée" d="M29,113c28,58 69,99 136,119l-10,11c-67-21-112-55-134-119z"/>
<path fill="couleur_centrale" d="M28,115c28,58 69,99 136,119l-7.4,6.7c-67-21-112-55-135.6-118.7z"/>

Écharpe à trois bandes inégales

[edit]

Avec les cas vus précédemment, nous allons pouvoir voir à présent des cas de figure plus particulier en commençant par ce quatrième cas.

Écharpe à trois bandes dont la bande centrale est plus large

[edit]

Cette première possibilité reprendra le code de l’écharpe à trois bandes égales mais nous allons changer la bande centrale. Notez que celle-ci doit toujours être placée en dernière :


Code
; Trois couleurs
<path fill="couleur_supérieure" d="M33,110c33,53 78,93 137.6,118.3l-6.6,5.7c-50-11-112-60-136-119z"/>
<path fill="couleur_inférieure" d="M21,122c32,79 79,99 135.6,118.7l-7.6,6.6c-62-11-111-51-134-119.3z"/>
<path fill="couleur_centrale" d="M29,114c26,50 73,91 136,119l-11,10c-65-15-107-50-135.6-118.7z"/>
Deux couleurs
<path fill="couleur_fond" d="M33,110c33.2,53 77.8,92 137.6,118.3l-21.6,19c-62-11-111-51-134-119.3z"/>
<path fill="couleur_centrale" d="M29,114c26,50 73,91 136,119l-11,10c-65-15-107-50-135.6-118.7z"/>

Écharpe à trois bandes dont la bande supérieure est plus large

[edit]

Cette seconde possibilité part de l’écharpe à deux bandes égales et coupe la bande inférieure en deux. Voici le code :


Code
; Trois couleurs
<path fill="#0dd" d="M33,110c33,53 78,93 137.6,118.3l-11.6,10.7c-50-11-112-60-136-119z"/>
<path fill="#dd0" d="M23,120c28,58 69,99 136,119l-5.4,4.7c-67-21-112-55-135.6-118.7z"/>
<path fill="#d0d" d="M18,125c32,79 79,99 135.6,118.7l-4.6,3.6c-62-11-111-51-134-119.3z"/>
Deux couleurs
<path fill="#0dd" d="M33,110 c33.2,53 77.8,92 137.6,118.3l-21.6,19c-62-11-111-51-134-119.3z"/>
<path fill="#d0d" d="M23,120c28,58 69,99 136,119l-5.4,4.7c-67-21-112-55-135.6-118.7z"/>

Écharpe à trois bandes dont la bande inférieure est plus large

[edit]

De même que la précédente, cette troisième possibilité part de l’écharpe à deux bandes égales et coupe la bande supérieure en deux. Voici le code :


Code
; Trois couleurs
<path fill="#0dd" d="M 28.66,114.47 C 53.8,175.5 109.03,217.35 164.69,233.53 L 170.59,228.31 C 110.99,209.01 66,168 33,110 z"/>
<path fill="#dd0" d="M 24.19,119.09 C 47.79,182.79 92.81,216.81 159.81,237.81 L 164.69,233.53 C 109.03,217.35 53.8,175.5 28.66,114.47 z"/>
<path fill="#d0d" d="M24.3,118.8c32,79 79,99 135.6,118.7l-10.8,9.5c-62-11-111-51-134-119.3z"/>
Deux couleurs
<path fill="#0dd" d="M33,110 c33.2,53 77.8,92 137.6,118.3l-21.6,19c-62-11-111-51-134-119.3z"/>
<path fill="#d0d" d="M 24.19,119.09 C 47.79,182.79 92.81,216.81 159.81,237.81 L 164.69,233.53 C 109.03,217.35 53.8,175.5 28.66,114.47 z"/>

Écharpe à deux bandes inégales

[edit]

Pour ce cinquième cas, nous verrons deux possibilités :

  1. la bande supérieure plus large ;
  2. la bande inférieure plus large.

Écharpe à deux bandes dont la bande supérieure est plus large

[edit]

Cette première possibilité est amené en fusionnant les bandes supérieure et centrale d’une écharpe à trois bandes :


Code
<path fill="couleur_supérieure" d="M33,110c33.2,53 77.8,92 137.6,118.3l-14,12.4c-67-21-112-55-135.6-118.7z"/>><path fill="couleur_inférieure" d="M21,122c32,79 79,99 135.6,118.7l-7.6,6.6c-62-11-111-51-134-119.3z"/>

Écharpe à deux bandes dont la bande inférieure est plus large

[edit]

Cette seconde possibilité est amené en fusionnant les bandes centrale et inférieure d’une écharpe à trois bandes :


Code
<path fill="couleur_supérieure" d="M33,110c33,53 78,93 137.6,118.3l-6.6,5.7c-50-11-112-60-136-119z"/><path fill="couleur_inférieure" d="M28,115c28,58 69,99 136,119l-15,13.4c-62-11-111-51-134-119.3z"/>

Écharpe en quartier

[edit]

Écharpe en quartier à quatre couleurs

[edit]
Code

Écharpe en quartier à trois couleurs dont les quadrants 1 et 3 sont de même couleur

[edit]
Code

Écharpe en quartier à trois couleurs dont les quadrants 2 et 4 sont de même couleur

[edit]
Code

Écharpe en quartier à deux couleurs

[edit]
Code

Ajouts

[edit]

Voici les codes pour des éléments supplémentaires :

Étoile de David

[edit]
Code
<g transform="matrix(0.74,0.67,-0.67,0.74,81.2,195.95)">
<path style="fill:none; stroke:couleur_trait; stroke-width:2" d="M 8.7,5 0,-10 -8.7,5 z" />
<path style="fill:none; stroke:couleur_trait; stroke-width:2" d="M 8.7,-5 0,10 -8.7,-5 z" />
</g>

Croissant islamique

[edit]
Code
<g transform="matrix(0.74,0.67,-0.67,0.74,81.2,195.95)">
<path fill="couleur_croissant" d="M -1.5,-12 C -8.13,-12 -13.5,-6.63 -13.5,0 -13.5,6.63 -8.13,12 -1.5,12 2,12 5.15,10.49 7.34,8.09 5.7,9.28 3.68,10 1.5,10 -4.02,10 -8.5,5.52 -8.5,0 -8.5,-5.52 -4.02,-10 1.5,-10 3.68,-10 5.7,-9.28 7.34,-8.09 5.15,-10.49 2,-12 -1.5,-12 z" />
<path fill="couleur_étoile" d="M 1.5,0 5.6,1.4 5.6,5.7 8.2,2.2 12.4,3.5 9.8,0 12.4,-3.5 8.2,-2.2 5.6,-5.7 5.6,-1.4 z" />
</g>

Croix helvète

[edit]
Code
<g transform="matrix(0.74,0.67,-0.67,0.74,81.2,195.95)">
<path fill="couleur_croix" d="M -12,-3 -3,-3 -3,-12 3,-12 3,-3 12,-3 12,3 3,3 3,12 -3,12 -3,3 -12,3 z" />
</g>

Croix scandinave

[edit]
Code
<path fill="couleur_croix" d="M 26,117 22,121 C 35.1,151.3 48.9,173.4 67.3,191 L 57.8,200.2 64.2,206.3 73.7,196.8 C 94.4,214.4 120.8,227.2 157.6,239.7 L 162.8,235 C 128.3,224.6 101.4,209.8 79.7,190.7 L 91.5,178.9 85.5,173.5 73.6,185 C 54,166.1 38.8,143.5 26,117 z" />

Soyez créatifs

[edit]

N’oubliez pas que vous pouvez prendre des bouts de code et les assembler comme bon vous semble.

Exemples

[edit]

Galeries

[edit]

Organisations internationales

[edit]

Afrique

[edit]

Amérique du Nord

[edit]


Amérique du Sud

[edit]

Asie

[edit]

Europe

[edit]

Notes

[edit]
  1. Non-officielle. La version officielle de l’écharpe européenne a les étoiles placé en cercle (comme sur le drapeau) en bas de la partie avant.
  2. a b c d e f g h i j k Officielle.
  3. Ancienne version officielle utilisée de 1943 à quelques part au cours des années 1980.
  4. Drapeau de la rébellion.