Paint the Web creating art with CSS Eva Lettner Frontend Developer - PowerPoint PPT Presentation

Apr 21, 2023 •234 likes •566 views

Paint the Web creating art with CSS Eva Lettner Frontend Developer @ ChillBill Coding "Artist" Code is magic We are Creators! CSS Original: https://www.instagram.com/365days.of.cacti/ Lets draw something! Shapes

Paint the Web creating art with CSS
Eva Lettner Frontend Developer @ ChillBill Coding "Artist"
Code is magic
We are Creators!
♥ CSS ♥
Original: https://www.instagram.com/365days.of.cacti/
Lets draw something!
Shapes
Rectangles .rectangle { width: 20rem; height: 20rem; }
Triangles .triangle { border-top: 10rem solid yellow; border-left: 10rem solid orange; border-bottom: 10rem solid purple; border-right: 10rem solid blue; }
Pseudo Elements
:before & :after before after
I'm a 1 div tooltip!
Box-Shadow
.eye { box-shadow: 0px 0px 0px #798d52, inset 0px 0px 0px #798d52; }
Why?
Why not?
It's fun!
Learn new stuff!
Community ♥
CSS images in production?
What did we learn?
Play
Learn
Just because it's "useless" doesn't mean it's a waste of time
Resources Codepen: http://www.codepen.io #cssdailyimages
Create! @eva_trostlos

Recommend

Generic types Paint design Please sit with your Paint project partner Solutions to HW6

Generic types Paint design Please sit with your Paint project partner Solutions to HW6 written problems and DotsUML should be in the usual place on ANGEL: Lessons > Assignments > Solutions Today: Statics revisited

622 views • 16 slides

How To: Make Your Own Paint By: Ivy Winter Flour Based Paint Materials: Mixing bowl 8 fluid

How To: Make Your Own Paint By: Ivy Winter Flour Based Paint Materials: Mixing bowl 8 fluid ounces warm water 12 ounces white flour 12 ounces table salt Squeeze bottles or resealable plastic bags Food coloring Flour Based Paint

288 views • 17 slides

A.S.Khanna Corrosion Science & Engineering IIT Bombay What do we mean by Paint Specification

How to Write Paint Specifications A.S.Khanna Corrosion Science & Engineering IIT Bombay What do we mean by Paint Specification Protecting a surface with a paint coating that takes care of the requirements of a user Requirements

782 views • 28 slides

PAINT CHARACTERISTICS Prof. A.S.Khanna Corrosion Science & Engg. IIT Bombay Various Kinds

PAINT CHARACTERISTICS Prof. A.S.Khanna Corrosion Science & Engg. IIT Bombay Various Kinds of Tests for paint Coatings Paint Characterization Volume solid, Density, viscosity, drying and curing properties, in case of two components

1.59k views • 39 slides

Slide into January Intel Chip Paint a 2" wooden square dark gray. Let dry. When the paint

~.,...,_SI"'_ Slide into January Intel Chip Paint a 2" wooden square dark gray. Let dry. When the paint dries, paint in white "Intel". Let dry. Then attach a piece of PVC pipe to the back with hot glue. Computer Mouse Using

404 views • 12 slides

Paint coverage/opacity (whites & off -whites with Resene Alabaster as the example)

Paint coverage/opacity (whites & off -whites with Resene Alabaster as the example) Introduction There are a number of areas that can contribute to paint coverage /opacity issues including over-spreading of paint, application methods

421 views • 20 slides

Overview of paint systems for exterior steel based on the AS/NZS2312 standards Paint Systems for

Overview of paint systems for exterior steel based on the AS/NZS2312 standards Paint Systems for Mild Steel Equivalents to AS/NZS 2312.1:2014 Starting Point To select the correct coating system first you must know the type of steel you

772 views • 15 slides

Curing of Waterborne paint (focusing on interior) General paint curing methods Waterborne

Curing of Waterborne paint (focusing on interior) General paint curing methods Waterborne Evaporation Oil based Oxidation (reacts with oxygen) 2K Epoxy/Urethane Chemical reaction Moisture cured polys Reaction with moisture in

1.2k views • 14 slides

Inspecting for Lead-based Paint Chapter 1 Course Overview Lead Inspector Chapter 1

Inspecting for Lead-based Paint Chapter 1 Course Overview Lead Inspector Chapter 1 Course Overview Course Purpose To train inspectors to identify lead in paint (lead-based paint inspections) dust and soil (clearance

1.97k views • 158 slides

LEAD PAINT REFORMULATION TECHNICAL GUIDELINES Amman, 31.03.2019. Vojislavka Satric CONTENT 1.

LEAD PAINT REFORMULATION TECHNICAL GUIDELINES Amman, 31.03.2019. Vojislavka Satric CONTENT 1. Technical Guidelines Content; 2. Colours and Paint Function; 3. Paint Raw Materials; 4. Lead Compounds in Paints; 5. Substitution Process; 6.

519 views • 28 slides

to Eliminate Lead Paint: Why Action Now Matters Briefing on the Global Alliance to Eliminate Lead

Overview of Global Efforts to Eliminate Lead Paint: Why Action Now Matters Briefing on the Global Alliance to Eliminate Lead Paint for Permanent Missions Geneva, Switzerland June 12, 2018 Walker B. Smith, Director Office of Global Affairs and

612 views • 27 slides

Overview of Global Efforts to Eliminate Lead Paint: Why Action Now Matters UN Environment GEF

Overview of Global Efforts to Eliminate Lead Paint: Why Action Now Matters UN Environment GEF Lead Paint Project Regional Workshop for Central and Eastern Europe and Central Asia March 19, 2019 Walker B. Smith, Director Office of Global

382 views • 12 slides

Industrial Industry Energy Demand Increases 250 Quadrillion BTUs 200 Paint Paint Fertilizer

Industrial Industry Energy Demand Increases 250 Quadrillion BTUs 200 Paint Paint Fertilizer Fertilizer Plastics Plastics 150 Chemicals Textiles Textiles 100 Automobiles Automobiles Steel Steel Manufacturing & Industry

583 views • 37 slides

Paint Mesh Cutting Lubin Fan Ligang Liu Kun Liu Zhejiang University Outline Related work

Paint Mesh Cutting Lubin Fan Ligang Liu Kun Liu Zhejiang University Outline Related work & Motivation Basic algorithm Graph cuts based optimization Paint mesh cutting system Global and local optimization Results

656 views • 49 slides

Low-level vision: shading, paint, and texture Bill Freeman October 27, 2008 Why shading,

Low-level vision: shading, paint, and texture Bill Freeman October 27, 2008 Why shading, paint, and texture matters in object recognition We want to recognize objects independently from surface colorings lighting surface

1.73k views • 145 slides

Poisonings from Housing Renovations Containing Lead Paint: e o at o s Co ta g ead a t A

Poisonings from Housing Renovations Containing Lead Paint: e o at o s Co ta g ead a t A Regulatory Update Delaware Healthy Homes Summit March 12, 2014 Presented by: Demian P. Ellis, USEPA Region 3 What will be covered What will be

872 views • 50 slides

TECHNICAL GUIDELINES Amman, 01.04.2019. Vojislavka Satric CONTENT 1. Technical Guidelines

LEAD PAINT REFORMULATION TECHNICAL GUIDELINES Amman, 01.04.2019. Vojislavka Satric CONTENT 1. Technical Guidelines Content; 2. Colours and Paint Function; 3. Paint Raw Materials; 4. Lead Compounds in Paints; 5. Substitution Process; 6.

801 views • 64 slides

Lead-based Paint Regulations Webinar November 21, 2008 www.nmhc.org Lead-Based Paint

Lead-based Paint Regulations Webinar November 21, 2008 www.nmhc.org Lead-Based Paint Renovation, Repair, and Painting Overview of Final Rule November 21, 2008 The Renovation, Repair, and Painting Rule (RRP) On March 31, 2008, EPA issued

708 views • 34 slides

WetBrush: GPU-based 3D Painting Simulation at the Bristle Level Zhili Chen Byungmoon Kim

WetBrush: GPU-based 3D Painting Simulation at the Bristle Level Zhili Chen Byungmoon Kim Adobe Research GTC 2016 Oil painting with brush Complex interactions Bristle-Bristle Bristle-Paint Paint-Paint Motivation:

374 views • 35 slides

Partners for Better Communities Managing Lead-Based Paint in Rehab Joanne Peerman Program

Partners for Better Communities Managing Lead-Based Paint in Rehab Joanne Peerman Program Manager Community Development Division, DHCD 2019 Grant Management Workshop November 2019 Partners for Better Communities Lead Based Paint Refresher

433 views • 31 slides

L e ad- Base d Paint Gr ant Pr ogr ams Qua lity of L ife Committe e Aug ust 17, 2020

L e ad- Base d Paint Gr ant Pr ogr ams Qua lity of L ife Committe e Aug ust 17, 2020 Cynthia Ro g e rs-E llic kso n, Assista nt Dire c to r Bra ndo n Aya la , Gra nt Spe c ia list Ho using & Urb a n De ve lo pme nt City o f Da

430 views • 16 slides

PAINT COATINGS A. S. Khanna Corrosion Science & Engineering IIT Bombay Importance of

SURFACE PREPARATION FOR PAINT COATINGS A. S. Khanna Corrosion Science & Engineering IIT Bombay Importance of Surface Preparation It has been found that about 90% of paint failures are due to poor surface preparation, hence :

1.03k views • 45 slides

LUCANT TM for urethane coatings For solvent-borne model systems on the urethane basis, LUCANT TM

LUCANT TM -Defoamer for paint and coating- NOTICE: All of the data are typical value, not specified LUCANT TM Defoamer for paint and coating- LUCANT TM LUCANT TM is a olefin-based oligomer. Features of LUCANT TM Fully saturated aliphatic

244 views • 12 slides

Tools of the Trade A quick look at tools of the trade Key Points Quality paint requires quality

Tools of the Trade A quick look at tools of the trade Key Points Quality paint requires quality application tools to achieve a good level of finish Quality paint applied with low quality tools will generally achieve a poor level of

384 views • 7 slides