Overview
Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!
Explore advanced CSS techniques for recreating subtle design details using Sass in this 20-minute conference talk from CSSConfUS 2013. Dive into topics such as extending placeholders, manipulating color lightness, implementing background color design logic, and creating layer styles. Learn how to craft intricate drop shadows using trigonometry, master Compass box shadows, and apply drop shadows and text shadows to buttons. Discover the art of linear gradients, including angle conversion and scaling techniques. Experiment with psychedelic linear grain effects and plot twists. Understand blend modes, their limitations, and how to implement gradient overlay conversions. Gain insights into refactoring and styling buttons efficiently. This talk provides a comprehensive toolkit for developers looking to elevate their CSS skills and achieve pixel-perfect designs.
Syllabus
Intro
Extend placeholder
Color lightness
Background color
Design logic
Layer styles
Drop shadow
Trigonometry
Compass
BoxShadow
DropShadow
TextShadow
Button
Text Shadow
Linear Gradient
Angle Conversion
Scale
Gradients
Psychedelic
Linear Grain
Plot Twist
Blend Modes
Blend Mode Limitations
Gradient Overlay Conversion
Tool Kit
Refactoring
Styling Buttons
Conclusion
Taught by
JSConf