CSS-pijlgenerator

Volgende

Maak een eenvoudige CSS-pijl. Kies rechts, links, omhoog of omlaag en stel kleur, vierkante grootte en randdikte in. Kopieer daarna de gegenereerde .arrow-regel.

Een CSS-pijl maken

  1. 1

    Kies een richting

    Selecteer rechts, links, omhoog of omlaag.

  2. 2

    Stel het uiterlijk in

    Kies kleur, grootte en randdikte in pixels.

  3. 3

    Kopieer de CSS

    Controleer het voorbeeld en kopieer de regel.

De generator maakt één vierkant .arrow-element met display: inline-block, gelijke breedte en hoogte, een rechter- en onderrand en een rotatie voor de vier richtingen.

Hij maakt geen randdriehoeken, clip-path, SVG, verlopen, diagonale pijlen of tooltipstaarten. Ook levert hij geen HTML, layoutvalidatie of compatibiliteitsadvies. Test de gekopieerde regel in je eigen pagina.

Gerelateerde tools