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.

Lifetime Access To FastestVPN, Only $29: Adblocker, Anti-Malware, NAT Firewall, Zero Log Policy

Lifetime Access To FastestVPN, Only $29: Adblocker, Anti-Malware, NAT Firewall, Zero Log Policy

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.

TemplateMonster Bootstrap Themes Bundle: 35 Premium Products, Animated, HTML, CSS, JS, SCSS, Pug,

TemplateMonster Bootstrap Themes Bundle: 35 Premium Products, Animated, HTML, CSS, JS, SCSS, Pug,

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.

200 Vector T-Shirt & Merchandise Designs, Only $24: Commercial License, Ai, EPS & SVG Vectors Files, 14 Concept Categories Like Retro 8Bit Illustra...

200 Vector T-Shirt & Merchandise Designs, Only $24: Commercial License, Ai, EPS & SVG Vectors Files, 14 Concept Categories Like Retro 8Bit Illustrations, Characters, Cartoons & More

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.

40 Premium WordPress Plugins to Revamp Your Website! SEO Optimizing, Campaign Management, Quality Leads Generation & Capture, Page Building, Social...

40 Premium WordPress Plugins to Revamp Your Website! SEO Optimizing, Campaign Management, Quality Leads Generation & Capture, Page Building, Social Conversion Boosting, Mobile Optimizing, Browser Graphical Editors, Opt-In Content Delivery, and so much more! Only 19$!