Kategorien zeigen

CSS Gradients-Generator

grad

Webkit unterstützt ja bislang als einziger Browser die CSS 3 Eigenschaft “Gradient” // Property: -webkit-gradient (Farbverläufe linear & radial)
So kann man hübsche Buttons also in Zukunft ganz ohne Grafiken basteln - wie gesagt funktioniert das ganze leider ausschliesslich ab Safari 4 - also bei der Anwendung der Eigenschaft bitte niemals vergessen einen Fallback mit einer Hintergrundfarbe für die Browser zu schreiben, die das nicht unterstützen.

Wer nun auf jeden Fall per CSS seine Farbverläufe gestalten möchte, dem sei der Gradient Generator von den Westciv Tools empfohlen. Einfach die gewünschten Farbwerte & Einstellungen wählen, und den CSS-Code generieren lassen.

Ich persönlich finde ja ein 1px breites Hintergrundbild, welches wenigstens browserübergreifend funktioniert, momentan immer noch die bessere Wahl - trotzdem ein nettes Tool, welches man sich ja mal vormerken kann und mit rumspielen kann ;)

http://webkit.org/blog/175/introducing-css-gradients/
http://westciv.com/tools/gradients/

Diese Icons verlinken auf Bookmark Dienste bei denen Nutzer neue Inhalte finden und mit anderen teilen können.
  • del.icio.us
  • MisterWong
  • Bloglines
  • Facebook
  • Technorati

CSS Color Replacement–Tool

css-color-editor

Intuitiver als die übliche „Search & Replace“ Methode im CSS Editor finde ich den „Replace CSS Colors–Editor“.
Ein nettes online Tool: Du lädst einfach das alte CSS File hoch, ersetzt das alte Farbschema durch ein neues deiner Wahl, und bekommst deinen neuen „Anstrich“ zum download angeboten. Perfekt um schnell mal einen Styleswitcher für die Webseite zu basteln.

http://css-color-replace.orca-multimedia.de

Diese Icons verlinken auf Bookmark Dienste bei denen Nutzer neue Inhalte finden und mit anderen teilen können.
  • del.icio.us
  • MisterWong
  • Bloglines
  • Facebook
  • Technorati

CSS Sprites / Single-Image Rollover Effekte

sprites

An sich überhaupt nicht neu, aber viele kennen diese bestimmte Vorgehensweise zum Erzeugen eines grafischen MouseOver-Effektes doch noch nicht und arbeiten immer noch mit verschiedenen Background-Images oder gar mit JavaScript.

Diese Icons verlinken auf Bookmark Dienste bei denen Nutzer neue Inhalte finden und mit anderen teilen können.
  • del.icio.us
  • MisterWong
  • Bloglines
  • Facebook
  • Technorati

CSS Typeset

CSS Typetools gibt’s zwar en Masse im Netz , aber dies ist ein besonders schönes wie ich finde. Einfach Text eingeben und CSS Code erzeugen lassen & Lesbarkeit testen.

http://csstypeset.com/

Diese Icons verlinken auf Bookmark Dienste bei denen Nutzer neue Inhalte finden und mit anderen teilen können.
  • del.icio.us
  • MisterWong
  • Bloglines
  • Facebook
  • Technorati