CSS Ribbons | Bypeople

deals

premiumpacks & css ribbons (30 items)

A set of CSS Ribbons delivered as JSFiddle, CSSDeck, and CodePen projects demonstrating CSS shapes, animations, and effects, featuring lightweight snippets and ready to implement. You'll find responsive CSS banners & ribbons, as well as animated buttons, headers, and badge ribbons in Flat and Material Design styles.

freebies

An animated ribbon developed in pure CSS that features nice and smooth transitions as you change the viewport size or hover over it.

An animated ribbon developed in pure CSS that features nice and smooth transitions as you change the viewport size or hover over it.

A beautifully crafted font created out of pure CSS made ribbons featuring smooth shadows that give this font a nice 3D feel.

A beautifully crafted font created out of pure CSS made ribbons featuring smooth shadows that give this font a nice 3D feel.

A neatly crafted animation in pure JavaScript for animating a smooth and nicely crafted CSS ribbon rising up from bottom to top.

A neatly crafted animation in pure JavaScript for animating a smooth and nicely crafted CSS ribbon rising up from bottom to top.

820+ Isolated Objects From 3 Different Mock-up & Scene Generators! Ultra High-Quality Assets In PSD format, Separated Shadow Layers For Every Objec...

820+ Isolated Objects From 3 Different Mock-up & Scene Generators! Ultra High-Quality Assets In PSD format, Separated Shadow Layers For Every Object, Pre-made Scenes & Background Textures Included. Get this bundle for just $19! (98% Off)

A neatly CSS crafted ribbon for side edge containers of products or services that are on sale. It is subtly designed as a short ribbon so as to not...

A neatly CSS crafted ribbon for side edge containers of products or services that are on sale. It is subtly designed as a short ribbon so as to not cover the content of the product/service's card.

A set of minimal style outlined ribbons featuring several shapes as diamond, ribbon, battle star, box, and rounded corners.

A set of minimal style outlined ribbons featuring several shapes as diamond, ribbon, battle star, box, and rounded corners.

An amazing loading icon that features a summation symbol made out of a dark ribbon that slides along making itself into the shape of the symbol.

An amazing loading icon that features a summation symbol made out of a dark ribbon that slides along making itself into the shape of the symbol.

1500+ Vintage Vector Elements With 100+ Vintage Style Illustrations, 900+ Ornaments, and 450+ Borders, All Professionally Made With a 19th Century ...

1500+ Vintage Vector Elements With 100+ Vintage Style Illustrations, 900+ Ornaments, and 450+ Borders, All Professionally Made With a 19th Century Touch. File Formats Ai and EPS, Get This Pack For Just $29! (58% Off)

A nicely pure CSS crafted ribbon that features a flat style in a blue scheme as well as folded ends that give it a cool feel.

A nicely pure CSS crafted ribbon that features a flat style in a blue scheme as well as folded ends that give it a cool feel.

A nice set of ribbons to feature either at the top or the bottom of containers designed in a nice flat style available in big, medium, and small si...

A nice set of ribbons to feature either at the top or the bottom of containers designed in a nice flat style available in big, medium, and small sizes.

A nicely crafted ribbon that features a rounded fold around the left edge of the container that features it, perfect for titles of containers with ...

A nicely crafted ribbon that features a rounded fold around the left edge of the container that features it, perfect for titles of containers with flat style content.

1380 Animal themed icons delivered in 7 different design styles: from the trendy Material or Flat Styles to Iconshock's unique creations. Only $19 ...

1380 Animal themed icons delivered in 7 different design styles: from the trendy Material or Flat Styles to Iconshock's unique creations. Only $19 for a limited time.

Quite an impressive SCSS ribbon animated with smooth sliding and fading in transitions at different times.

Quite an impressive SCSS ribbon animated with smooth sliding and fading in transitions at different times.

A nicely crafted JavaScript animation that gives your ribbon-featured logos quite a lot of life and action by loading and fading in bit by bit.

A nicely crafted JavaScript animation that gives your ribbon-featured logos quite a lot of life and action by loading and fading in bit by bit.

A set of 5 nicely crafted different shaped SCSS buttons that lift up a bit as you hover over them. You'll find diamond, ribbon, arrow, rounded, and...

A set of 5 nicely crafted different shaped SCSS buttons that lift up a bit as you hover over them. You'll find diamond, ribbon, arrow, rounded, and sheer shapes.

Get today more than 1000 Packages and Boxes Mockup Files in an extensive bundle for only $29 with a 95% limited discounted price of its normal $550...

Get today more than 1000 Packages and Boxes Mockup Files in an extensive bundle for only $29 with a 95% limited discounted price of its normal $550 USD. Find different materials and presentations (Box, Paper, Metal, Plastic and Bottle) and hundreds of possible matches and finishes for your packages.

A responsive CSS ribbon that features a nice stitched border sticking at 90% of the size of the viewport, perfect for titles of responsive pages.

A responsive CSS ribbon that features a nice stitched border sticking at 90% of the size of the viewport, perfect for titles of responsive pages.

A pure CSS developed badge made out of ribbons that allows you to feature a text inside it, perfect for featuring awards and prices.

A pure CSS developed badge made out of ribbons that allows you to feature a text inside it, perfect for featuring awards and prices.

A nicely crafted CSS modal that features a cool ribbon as an [X] close button that stretches a nit as you hover over it.

A nicely crafted CSS modal that features a cool ribbon as an [X] close button that stretches a nit as you hover over it.

131 unique high-resolution mockup, based on real images and also including smart objects feature to get photo-realistic effects. Normally this bund...

131 unique high-resolution mockup, based on real images and also including smart objects feature to get photo-realistic effects. Normally this bundle could be priced up to $380, get it only $14! Limited-time promo.

Ribbons in pure CSS forming the letter "M" in different colors, a really simple snippet to add into your next website or mobile app. In this exampl...

Ribbons in pure CSS forming the letter "M" in different colors, a really simple snippet to add into your next website or mobile app. In this example, there are eight different tones you can choose from, and you can always grab the code and modify it. Created by André Kussmann.

An animated CSS Ribbon loader, highly customizable and perfect to be included in your personal or commercial project. The ribbon moves up and down ...

An animated CSS Ribbon loader, highly customizable and perfect to be included in your personal or commercial project. The ribbon moves up and down changing its color.

A good-looking banner styled with CSS only. It features subtle shadows for a well accomplished 3D effect and little details around the triangle edg...

A good-looking banner styled with CSS only. It features subtle shadows for a well accomplished 3D effect and little details around the triangle edges. Additionally, a somewhat ornamental font decorates the ribbon and displays the information it was designed for.

Massive 23,000+ PowerPoint Presentation Slides Bundle, 2000+ Vector Icons, 3 Aspect Ratio Formats, Animated Transitions, Drag & Drop Image Placehol...

Massive 23,000+ PowerPoint Presentation Slides Bundle, 2000+ Vector Icons, 3 Aspect Ratio Formats, Animated Transitions, Drag & Drop Image Placeholders, Vector Shape Elements, Scalable World & USA State Maps, Infographics, Tons of Content More! Only 19$ (92% Off)

An awesome ribbon that portrays a quite basic look at first, but when hovering on it, we can see how the menu “bends” and animates in a slick fashi...

An awesome ribbon that portrays a quite basic look at first, but when hovering on it, we can see how the menu “bends” and animates in a slick fashion, bringing out the options to highlight them (and switching colors to a nice orange for as long as the selection is being hovered). The design is completely styled with CSS.

A nice curved ribbon designed in CSS completely. The aforementioned curve is definitely the standout here, as it provides great dimension and persp...

A nice curved ribbon designed in CSS completely. The aforementioned curve is definitely the standout here, as it provides great dimension and perspective to an otherwise "normal" ribbon. It is very easy to customize, so you should not have much trouble adjusting this element according to your needs.

A responsive ribbon created entirely with the help of CSS. The demo even includes a selector to change the size of the element with no problem. The...

A responsive ribbon created entirely with the help of CSS. The demo even includes a selector to change the size of the element with no problem. The ribbon features gradient and shadow effects with triangle edges on the back. Uploaded by Calou to JSFiddle.

40 Display Fonts Bundle, 9 Type Design Styles, Several Weights, Variations, Alternate Characters, Ligatures, and Multi Language Support! Slick desi...

40 Display Fonts Bundle, 9 Type Design Styles, Several Weights, Variations, Alternate Characters, Ligatures, and Multi Language Support! Slick designs with tons of mojo, only 19$ (93% Off)

A smooth and easy ribbon design. You can modify the text inside of this element directly and its size is totally responsive to the size of your text.

A smooth and easy ribbon design. You can modify the text inside of this element directly and its size is totally responsive to the size of your text.

A very attractive corner ribbon made in CSS, ideal for placing on top of other elements within the website. It comes with a set of beautifully arra...

A very attractive corner ribbon made in CSS, ideal for placing on top of other elements within the website. It comes with a set of beautifully arranged lighting and shadow effects that give it a somewhat impressive - if not realistic - look and feel. This project was developed by CodePen's Anthony Collurafici.

A nice red ribbon design that includes a couple of gradient and shadow effects for a polished look. This element was styled with CSS in its entiret...

A nice red ribbon design that includes a couple of gradient and shadow effects for a polished look. This element was styled with CSS in its entirety. As a nice detail, a couple of buttons allows us to change the size of the element constantly at will. Created by Chris Harris based on a piece of work found at Premium Pixels.

Cartoon Avatars Creator Pack With Over 1800 Vector Elements To Compose Unique Looking Characters With Their Own Facial Expressions, Outfits, Hairst...

Cartoon Avatars Creator Pack With Over 1800 Vector Elements To Compose Unique Looking Characters With Their Own Facial Expressions, Outfits, Hairstyles, And Much More! Endless Combinations, Only $19! (34% Off)

A good-looking CSS ribbon with a beautiful color palette and overall style that reminisces of ancient Rome. The asymmetric bend around the edges is...

A good-looking CSS ribbon with a beautiful color palette and overall style that reminisces of ancient Rome. The asymmetric bend around the edges is also a nice point to address, as well as the font. Although as you know, you can always change these details by hacking the code.

A flat-styled ribbon made in CSS that doesn't exactly impress at first glance, but it contains a quite pleasant surprise in the form of a smooth an...

A flat-styled ribbon made in CSS that doesn't exactly impress at first glance, but it contains a quite pleasant surprise in the form of a smooth animation that will open up the ribbon with the edges moving right after the main portion. It manages to keep the outcome simple, but somehow entertaining. This ribbon can be used and edited for free, and it was created by Josh Bader.

A classy pair of animated ribbons created by Bennett Feely from CodePen. The concept is quite simple, consisting of two elements that animate up an...

A classy pair of animated ribbons created by Bennett Feely from CodePen. The concept is quite simple, consisting of two elements that animate up and down in an endless loop. Can't see many practical uses for this, but it sure represents a good bit of fun.

Ultimate Tech Training Bundle: Lifetime Subscription for $19! 800+ Courses to learn Programming, Web Development, Software Testing, Mobile Apps, Ne...

Ultimate Tech Training Bundle: Lifetime Subscription for $19! 800+ Courses to learn Programming, Web Development, Software Testing, Mobile Apps, Networking, e-Commerce, Design, Data, IT Certifications, and much more! (98% Off)

An orange ribbon logo created for titles of any kind and coded exclusively with CSS. It consists of this long element that goes around itself three...

An orange ribbon logo created for titles of any kind and coded exclusively with CSS. It consists of this long element that goes around itself three times in order to show the three available text lines. It can be used for any occasion when a good amount of attention is required.

A very detailed ribbon made exclusively with CSS3. It uses a few effects applied to specific areas in order to give it its complete and convincing ...

A very detailed ribbon made exclusively with CSS3. It uses a few effects applied to specific areas in order to give it its complete and convincing look. For example, a shadow was added on top while a couple of rotated squares form the ribbon shape at the bottom of the design.

A simple design that offers an empty ribbon created with pure CSS. It can be useful for headings in all sorts of websites and devices, given its re...

A simple design that offers an empty ribbon created with pure CSS. It can be useful for headings in all sorts of websites and devices, given its responsive design that adjusts to any situation. All credit goes to CodePen user Will Paige for developing this project.

1000 Business Card Templates, only $14! Includes Editable Vector Files, Print Ready Templates 300 PDI CMYK, Dimensions 3.5" x 2.1". Commercial Use ...

1000 Business Card Templates, only $14! Includes Editable Vector Files, Print Ready Templates 300 PDI CMYK, Dimensions 3.5" x 2.1". Commercial Use License.