CSS knoppen generator

buttons
buttons (Photo credit: sharonstoned1)

Mede dankzij de mogelijkheden van CSS3 zijn er diverse mogelijkheden om mooie / leuke knoppen te maken voor op jouw website. Je hoeft dus niet meer met Photoshop of een ander tekenprogramma aan de slag om een aardige button te ontwerpen. Maar ondanks dat je een leuke knop kunt designen met CSS, is het nog best lastig om de stylesheet codes goed te krijgen en hierin ook de juiste kleuren te verwerken. En ben je klaar dan valt het resultaat misschien zelfs een beetje tegen en moet je opnieuw de CSS aanpassen.

Maar je kunt ook gewoon lekker aan de slag met diverse online button generators. Er zijn diverse sites waarop je de CSS code van een leuke knop kunt laten genereren. Hieronder noem ik een paar sites met een CSS knoppen generator erop:

  • http://www.cssbuttongenerator.com/

    Een handige tool want hierin zitten alvast wat kleurschema’s en het is verder vrij eenvoudig in het gebruik. Er missen wel een paar extra tweaks die andere tools wel hebben maar dat is het gevolg van het eenvoudig willen houden van de tool vermoed ik. Wat ook handig is, de achtergrond van de preview knop is hier effen grijs waardoor je via een screenprint de knop eenvoudig kunt uitknippen en in jouw Photoshop ontwerp kunt plaatsen.

  • http://css-tricks.com/examples/ButtonMaker/
    Deze is iets minder vriendelijk in het gebruik en heeft iets minder opties maar doet de klus ook prima. De knop staat hier op een fancy achtergrond en ziet er daardoor wat leuker uit maar dit is lastig uitknippen in een tekenpakket.
  • http://css3button.net/
    De knop generator bevat eigenlijk alle mogelijke opties. In eerste instantie mis je hier de presets / kleurschema’s. Maar die zijn hier juist in grote aantallen aanwezig. Je moet dan alleen klikken op “showcase” en dan krijg je meer dan 12500 voorbeeldknoppen te zien. Helaas heb je hier geen mogelijkheid om de knoppen te filteren op kleur / stijl / etc. waardoor je niet kunt zoeken naar een geschikte knop in deze massa aan buttons.
  • http://www.cssbutton.me
    Ja dit is een flinke CSS button tool. Ik zou bijna zeggen: wouw! Maar dit is niet direct geschikt voor een beginner. Aan de andere kant, door gewoon maar wat te proberen zie je direct wat de gevolgen zijn van jouw instellingen. Dan zie je ook wat voor gekke buttons je hier kunt ontwerpen zoals buttons met schuine zijkanten, volledig rond, etc. Ook kun je werken aan een bestaande button vanuit de button templates optie. Hier staan nu nog slechts 5 voorbeeldbuttons maar daar komen misschien later meer templates bij. En als je inlogt dan kun je de door jou ontworpen knopjes opslaan.
  • http://www.glassybuttons.com/glassy.php
    Maar misschien wil je een glassy button / glas knop en juist niet een CSS / html only knop? Dat kan op deze site. Ontwerp hier jouw glassy button en zodra je tevreden bent dan download je deze knop als afbeelding. Geen gedoe verder ook met browser versies, ondersteuning voor CSS 3, etc.
  • http://www.cssbuttonmaker.com/
    Deze tool heeft veel weg van de eerst genoemde tool cssbuttongenerator.com alleen ziet deze er iets minder mooi uit. Ik zou deze zelf dus minder snel gebruiken. Maar handig om te vermelden in het geval cssbuttongenerator.com uit de lucht is of wanneer deze site niet meer gratis is! 🙂
Enhanced by Zemanta
Geen reacties

Geef een antwoord

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *

voordelen nadelen Wordpress
Webdesign
De voordelen en nadelen van WordPress

Misschien overweeg je een website te bouwen of te laten bouwen met behulp van WordPress. Of er is een andere reden dat je onderzoek doet naar WordPress. Hoe dan ook, je vraagt je af: Wat zijn de voordelen van WordPress? En wat zijn de nadelen? Dus je zoekt een duidelijk …

Webdesign
De beste Retro en Vintage Webdesigns

Grafisch ontwerpen is een vak apart. En vervolgens heb je het resultaat dat de één het einde vindt en de ander vindt het niets… kwestie van smaak zeggen we dan. Maar kwalitatief design is zeker herkenbaar en kwaliteit is geen kwestie van smaak. Binnen grafisch ontwerp zie je bepaalde stijlen …

Strato sitebuilder of Wordpress
Webdesign
STRATO Sitebuilder of WordPress?

Een begrijpelijke vraag die veel ondernemers hebben die een nieuwe site willen maken (of laten maken): kies ik voor STRATO sitebuilder of voor een eigen WordPress website? Het is geen eenvoudige afweging en ook afhankelijk van jouw specifieke situatie. Laten we voorop stellen dat geen van de hiervoor genoemde mogelijkheden …

Shares