Line25 retweetledi
I just found my Christmas present. Thanks 😊
English
Line25
51.3K posts
Line25
@line25blog
Learn About Current Web Design Trends From Line25. Weekly Tweets Include Best Web Design & Graphic Design Tips, Software & Top Design Tools.
Katılım Ocak 2009
6.2K Takip Edilen22.5K Takipçiler
Using AI to Create Content: For Web Designers & Bloggers
line25.com/articles/using…
English
Line25 retweetledi
Future CSS Tip! 🔮
You can create sweet scroll-driven micro-interactions using CSS scroll-driven animations 😎
.avatar {
animation: scale-down;
animation-timeline: scroll();
animation-range: var(--header-range);
}
@ keyframes scale-down {
to {
scale: 0.3;
}
}
What's happening in this one? 👀
1. Avatar moves and scales down as the header sticks
2. Name changes color and slides over
3. Header darkens to give the text contrast
4. Header gets a shadow
5. Notice the avatar scrub too! 👀 It's scroll-driving the sprite animation technique we went over earlier in the week ✨
So much fun! ✨ Could even tie in the new easings from earlier too!
@CodePen link below! 👇
English
Line25 retweetledi
#ArchitectureFriday | The stunning Eastern Columbia Building in Los Angeles is considered the greatest surviving example of Art Deco architecture in the city.
Designed by architect Claud Beelman, the Building is distinguished for its many Art Deco motifs.
📸 Elizabeth Daniels
English
Line25 retweetledi
How I as a graphic designer with 8 years design experience use textures in my work.
See how below ↓
English
Line25 retweetledi
Future CSS Tip! 🔮 (This one's close 🤏)
You can use "subgrid" to give child elements access to a parent's grid tracks 👀
This is great when you want to make sure content lines up 🙌 Check those cards 👇
article {
grid-row: span 4;
display: grid;
grid-template-rows: subgrid; 👈
}
In this example, article uses grid but makes use of the tracks defined by the parent layout container. That makes it easier to line up content within the cards 🙏
Cool thing is, we don't even need to define the rows in the parent. We use the implicit ones from the parent.
main {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))
}
This might be easier to understand with the video below that shows the grid tracks using DevTools and toggles subgrid on and off 🤙
@CodePen link below! 👇
English
Line25 retweetledi
Line25 retweetledi
Line25 retweetledi
Want to analyze any website's SEO strategy?
My team @aioseopack built a free SEO Analyzer Chrome extension that you'll love ❤️
It helps you see on-page SEO details of any page that you're visiting.
You can use it to:
- Analyze competitor's SEO schema settings
- See all internal links & keywords on a specific page
- Highlight Nofollow links on any page (great for writers)
... and so much more.
You can try it here:
chrome.google.com/webstore/detai…
Our goal is to make SEO easy and affordable for everyone ... so this is 100% free for everyone.
Let me know your ideas on how we can improve it 🚀
Many thanks for pressing 🔁 and ❤️!
English
Line25 retweetledi
Line25 retweetledi
🌟Pencil made out of a single <div></div> in CSS & HTML.
View code here: codepen.io/kassandrasanch…
English
Line25 retweetledi
How these 3D backlit Hwang Seontae inspired artworks are made
[📹 moodymouse.world: buff.ly/45OZsTT]
English
Line25 retweetledi
Line25 retweetledi
Best Resume Templates for Graphic Designers (15 Free Options)
webdesigndev.com/graphic-design…
English
Line25 retweetledi
Line25 retweetledi
