deals

premiumpacks & css blockquote (12 items)

Snippet and demos on Blockquotes using mostly CSS.

freebies

Mary Lou from Codrops created this collection of modern blockquotes, explained in a walkthrough on the creation of some fancy blockquote styles. Us...

Mary Lou from Codrops created this collection of modern blockquotes, explained in a walkthrough on the creation of some fancy blockquote styles. Using textures, circles, and pseudo-elements, she puts some life into quotations and testimonials, explaining how to create the markup, how to add the CSS, and then showing various examples for each one of them.

Martin Wolf from Codepen has created this flat blockquotes demo inspired by quote.fm. It is composed of the quoted text within a blue space that lo...

Martin Wolf from Codepen has created this flat blockquotes demo inspired by quote.fm. It is composed of the quoted text within a blue space that look like if it was selected. It does not have any quote icons, but it sure has a nice design that works for any website. It was created in HTML and SCSS.

Here you have a nice blockquote slider made in CSS3 and put together in JSFiddle. It can show you different quotes within the same container. The e...

Here you have a nice blockquote slider made in CSS3 and put together in JSFiddle. It can show you different quotes within the same container. The element is composed of four parts: one with the text of the quote, the second with the profile pic of the author, the next component has the name and other info of the user, and the last one lets you scroll amongst quotes.

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.

This code snippet creates a simple quote with italic texts, a single quotation icon on the top left corner, and it also has a reference. The texts ...

This code snippet creates a simple quote with italic texts, a single quotation icon on the top left corner, and it also has a reference. The texts are centered, and it is not responsive, but with the help of some media queries you can alter the CSS file.

CSS Speech Bubble is a set of simple flat blockquotes that was put together in JSFiddle, it was created on HTML and CSS. It also has a slightly big...

CSS Speech Bubble is a set of simple flat blockquotes that was put together in JSFiddle, it was created on HTML and CSS. It also has a slightly bigger typography for the actual quote text, and it has the reference at the bottom left comprised in a nice flat speech bubble.

Here we have an elegant notepaper blockquote achieved through pure CSS. The properties used for this snippet include radial-gradient, repeating-lin...

Here we have an elegant notepaper blockquote achieved through pure CSS. The properties used for this snippet include radial-gradient, repeating-linear-gradient, transform, and some :before/:after magic for the curly quotes. It’s flexible in width and height, and also it degrades well on older browsers.

13,000+ Unique PowerPoint & Keynote Slides, 86 Best Selling Templates, Print Ready (A4 + Letter), Smart Objects, Vector Shapes, 160 Color Schemes, ...

13,000+ Unique PowerPoint & Keynote Slides, 86 Best Selling Templates, Print Ready (A4 + Letter), Smart Objects, Vector Shapes, 160 Color Schemes, Icon Fonts, 16:9 Aspect Ratio, Intros, Maps, Infographics, Tables, Calendars, Charts, and Much More! Get it for Only $19 (99% Off)

This code experiment allows you to make an elegant quote put together in Codepen by the user Vero. It has a flat style, emphasising on the cen...

This code experiment allows you to make an elegant quote put together in Codepen by the user Vero. It has a flat style, emphasising on the central quotation icon, followed by the text and the reference. It also has space for links and more, and it was created with HTML and CSS.

This code snippet creates a responsive grid layout that breaks down into a single column. The quote box has been created with pure CSS, but the tri...

This code snippet creates a responsive grid layout that breaks down into a single column. The quote box has been created with pure CSS, but the triangle part was a bit tricky. Also, it uses jQuery for responsiveness, and CSS for giving it its cool flat style. The text does not change at all, and the quotes icons are not even included (so you need to type them). At the bottom, it shows the reference.

This is a black quote box with a contrasting yellow background put together in Codepen by the user jbstowe. The bad thing about it is that it has a...

This is a black quote box with a contrasting yellow background put together in Codepen by the user jbstowe. The bad thing about it is that it has a fixed area, so if you have a really long quotation, you might have a hard time trying to adequate the box to work. It has a flat design that includes icons, texts in two different sizes and lastly, it has the reference text. It was created in SCSS and HTML.

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)

The beautiful thing about this blockquote is that it not only displays the quotes in a simple way, but instead it creates a nice stripped patterned...

The beautiful thing about this blockquote is that it not only displays the quotes in a simple way, but instead it creates a nice stripped patterned background with a frame to contain it. Also, it adds the quote icon on the top left and bottom right of the container, so it actually looks like a quote. Typography does not change, but it gets bigger, and quotes can have the reference or not, and either way they will look nice. This code experiment was created by Hamza Oza.

This element is a nice visual blockquote bracket style using pseudo :before and :after elements. It is composed of two brackets, in which the typog...

This element is a nice visual blockquote bracket style using pseudo :before and :after elements. It is composed of two brackets, in which the typography is enlarged and becomes italic to indicate quoting. However, it does not include any references or icons. The frame gets centered so the quote becomes even more important than the text without overshadowing it.

This creation is a simple black and white blockquote box. It helps your users or readers identify easily whether they are reading a quote or anothe...

This creation is a simple black and white blockquote box. It helps your users or readers identify easily whether they are reading a quote or another text. It has a big blockquote icon, nice typography which highlights the quote, the reference at the bottom right and the effect of lightening up the box with a bottom bright. It was created by Lukas Dietrich.

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.