SpyreStudios

Web-Design and Development Magazine

  • Design
  • Showcase
  • Inspirational
  • Tutorials
  • CSS
  • Resources
  • Tools
  • UX
  • More
    • Mobile
    • Usability
    • HTML5
    • Business
    • Freebies
    • Giveaway
    • About SpyreStudios
    • Advertise On SpyreStudios
    • Get In Touch With Us

Kerning, Leading, Tracking, and Everything You Need to Know About Text Spacing

May 9, 2019 by Alex Fox

The space between letters is just as important for legibility as the text itself. If your website is hard to read, don’t just consider the typeface: consider the white space as well. With kerning, leading, tracking, and other spacing tools, you can make your text more readable without a major design overhaul using these text […]

Filed Under: CSS, Design, Typography Tagged With: css, fonts, line spacing, typography

Dazzling Slow Motion Effects For Tomorrow’s Sites

April 15, 2019 by Alex Fox

Slow motion effects can be attention-grabbing tone setters in your website. Careful use of animation helps users better understand a changing user interface. When to Animate Your User Interface When we see an interface visually animate from one state to the next, it helps the user understand “where” they are in the metaphorical spacial plane […]

Filed Under: CSS Tagged With: animation, css, Design

CSS Variables: An Introduction, With Code Examples

November 26, 2018 by Alex Fox

CSS variables, also known as CSS custom properties, expand the script-like functionality of CSS into something that resembles a programming language. If you’re at all familiar with any type of programming language, you know that variables are the foundation of any action. Variables are set, compared, altered, and saved throughout the program as the means […]

Filed Under: Tutorial, Uncategorized Tagged With: coding, css, css variable examples, css3, html5

Draw with CSS: Using CSS To Draw Elements

October 22, 2018 by Alex Fox

With clever use of CSS properties, it is in fact possible to draw very complex shapes. All the shapes below were drawn with CSS alone. It might be that CSS isn’t the best way to render shapes in the browser window, but it’s very fast and included for “free” on all modern browsers. Learn how […]

Filed Under: CSS, Tutorial Tagged With: css, drawing, tutorial

The Future of CSS

October 1, 2018 by Spyrestudios

Responsive Typography Guide

Anyone who knows a thing or two about coding is cognizant of the fact that CSS and HTML are necessary tools to shape a website according to the specifications of clients. CSS or Cascading Style Sheets is a front-end web development practice that makes use of graphical interfaces to interact and communicate with the user.

Filed Under: CSS Tagged With: css

Getting Started with CSS Grid Layout

June 25, 2018 by Alex Fox

CSS has been a central web design tool for years and years now. And yet, CSS layouts have never been quite that elegant. Positioning two elements side-by-side has often required hacks or uncomfortable compromises. It feels like the language has been lagging behind its use since its creation. But now, CSS is jumping to the […]

Filed Under: CSS Tagged With: css, grid-based editorial design, grids, web design

What is Z-Index and How Does It Work?

June 18, 2018 by Alex Fox

Elements on a web page can stack for a variety of reasons. With basic CSS positioning tools, it’s possible to stack elements on top of one other with negative margins, floats, and other tools. Even without specific position, elements stack, with div stacking on backgrounds on table cells stacking on tables. But default stacking is […]

Filed Under: CSS Tagged With: css, css3, layout

Using CSS Pseudo-elements and Pseudo-classes like ::before and ::after

April 23, 2018 by Alex Fox

CSS wasn’t always as flexible as it is today. By using CSS pseudo-elements and pseudo-classes, designers can target elements based on their dynamic states or positioning in relation to other elements.

Filed Under: CSS Tagged With: css, css3, web design

Coding Buttons in CSS

March 2, 2018 by Spyrestudios Blogger

CSS is the gold standard in web design, providing an organized framework for your website. It takes added skill, though, to turn a basic CSS grid into an interactive site. One of those necessary skills is adding clickable buttons within the CSS grid to enhance and simplify navigation. Once you’ve developed a basic CSS grid, […]

Filed Under: CSS, Design Tagged With: coding buttons in CSS, color coding, css, library of options

How to Change Default Text Wrapping with HTML and CSS

February 1, 2018 by Spyre Studios

change default text wrapping

Remember the old days of the Internet where you have to scroll sideways? It’s a bit annoying, especially if you’re reading a lot of texts that had been extended to the side. Thankfully, web pages can be coded to wrap text, and you can choose to wrap it according to the text container width or […]

Filed Under: CSS, Tutorial Tagged With: css, html, text wrapping

  • 1
  • 2
  • Next Page »

SpyreStudios © 2019