Victor Loux → Bookmarks → Tag: css

124 bookmarks tagged “css”

CSS Scroll Snap

ishadeed.com/article/css-scroll-snap/

Link hover animation

codepen.io/aaroniker/pen/VwjexVy

yuanchuan on CodePen

codepen.io/yuanchuan/

Generative art with CSS

generative-art-with-css.commons.host/
Translation of Generative art with CSS by Yuanchuan at the 5th CSSConf in China

What does 100% mean in CSS?

wattenberger.com/blog/css-percents
<p>One of the CSS units I use most is the wonderful <b>%</b> — so handy for positioning elements on the page.</p><p>Unfortunately, the rules aren’t exactly straightforward. One question I’m always asking myself is: Percent of what?</p>

Building a hexagonal grid using CSS grid - ninjarockstar.dev

ninjarockstar.dev/css-hex-grids/

Custom Styling Form Inputs With Modern CSS Features | CSS-Tricks

css-tricks.com/custom-styling-form-inputs-with-modern-css-features/

brumm.af

brumm.af/shadows
Web site created using create-react-app

Solved by Flexbox — Cleaner, hack-free CSS

philipwalton.github.io/solved-by-flexbox/

Smoother & sharper shadows with layered box-shadows | Tobias Ahlin

tobiasahlin.com/blog/layered-smooth-box-shadows/
With a simple CSS trick, we can get fine-tuned control over how shadows are rendered, and create richer and more realistic 3D effects

Relearn CSS layout: Every Layout

every-layout.dev/

CSS Grid Generator

cssgrid-generator.netlify.com/

Under-Engineered Toggles | Adrian Roselli

adrianroselli.com/2019/03/under-engineered-toggles.html

Adactio: Journal—Split

adactio.com/journal/15050
Materials and tools; client and server; declarative and imperative; inclusion and privilege.

All you need to know about hyphenation in CSS | Clagnut by Richard Rutter

clagnut.com/blog/2395
Automatic hyphenation on the web has been possible since 2011 and is now broadly supported. There is however far more control available to designers than just turning on hyphens.

Using CSS Grid the right way | hey it's violet

vgpena.github.io/using-css-grid-the-right-way/
CSS Grid is fun to use but hard to learn. Here are three tips to help you understand and leverage the Grid spec.

Reader Mode: The Button to Beat | CSS-Tricks

css-tricks.com/reader-mode-the-button-to-beat/
As a young nerd, I loved to immerse myself in digital worlds, learning the ins and outs of the rules someone else had created for me (intentionally or

Atomic Design by Brad Frost

atomicdesign.bradfrost.com/
Learn how to create and maintain digital design systems, allowing your team to roll out higher quality, more consistent UIs faster than ever before.

Rhythm in Web Typography | Better Web Type

betterwebtype.com/rhythm-in-web-typography
Horizontal rhythm mostly impacts the legibility, while vertical rhythm impacts the readability of the text and establishes a sense of visual hierarchy.

Designing The Perfect Date And Time Picker — Smashing Magazine

smashingmagazine.com/2017/07/designing-perfect-date-time-picker/