Knopstatussen die zijn opgeslagen als afbeeldingen en zijn geschakeld door CSS zijn zo verouderd dat het pijnlijk is. We zouden allemaal CSS3 moeten gebruiken om knoppen te maken. We weten allemaal waarom: ze zijn gemakkelijk bewerkbaar, platformonafhankelijk, lichtgewicht, toegankelijk; de lijst met voordelen is eindeloos.

Wat niet altijd zo gemakkelijk is, is om ze te coderen. Natuurlijk kun je een framework gebruiken, maar voor de meeste projecten is dit gewoon te groot. Misschien wilt u vasthouden aan een plat ontwerp; voeg gewoon een achtergrondkleur toe en zorg ervoor dat de standaardrand is verwijderd. Iedereen anders zal blij zijn dat Irina Petculescu, een zelfverklaarde CSS3-junkie en oprichter van prowebdesign.ro heeft deze gratis CSS3-knoppen samengesteld. Zie haar site voor meer freebies.

Ze zijn er in twee stijlen: plat, met een kleine schuine rand; en glanzend, met mooi weergegeven verlopen. Er zijn zelfs enkele basale overgangen om de rollovers mooi en soepel te maken.

Wat nog beter is, is dat het team ervoor zorgde dat ze de rgba-opmaak voor de styling gebruikten, waardoor de achtergrondkleuren in hex-formaat bleven. Dat betekent dat u de hex-kleuren die u in de CSS ziet, kunt wijzigen en dat de achtergrondkleur van de knop onmiddellijk zal veranderen.

De knoppen zijn gratis voor persoonlijk en commercieel gebruik, dus download ze nu en begin ze te tweaken voor je merk.

Platte knoppen

invalide

Glanzende knoppen

invalide

Hoe codeer je knoppen? Is er ooit een reden voor beeldstaten langer? Laat ons je mening weten in de reacties.