Cards — 860 CSS effects
Content cards, product surfaces, and layered interface panels.
Pure CSS with no dependencies or build step. Open any effect for a live preview, source code, and browser editing.
Page 1 of 9
Cards effects
Locked Achievement Card
Locked achievement card with a padlock, blurred reward, and unlock hint.
Beer Pair Tips Card
Beer pairing tips card with beer style, dish pairing, and reasoning.
Cocktail Menu Card
Cocktail menu card with a glass illustration, ABV, and tasting notes.
Codex Lore Card
Codex lore card with an illuminated initial, parchment, and ornate border.
Coffee Passport
Coffee passport card with stamp grid, roast notes, and a bean icon.
Discount Coupon
Coupon card with scissors, a dashed cut line, notch cutouts and a big discount percentage.
Credit Card
Realistic credit card with a gold chip, embossed number, brand mark and details.
Invite Only Card
Invite-only card with an envelope flap, wax seal, and elegant calligraphy title.
Student ID
Student ID card with a portrait, university header, and a barcode strip.
Visa Stamp Card
Passport visa stamp card with an angled ink stamp and entry/exit details.
Weather Today Card
Today's weather widget with temperature, condition, and high/low.
YouTube Video Card
YouTube-style video card with thumbnail, duration badge, title, and channel.
Platinum Achievement Card
Platinum-tier achievement with elite platinum theme.
Aurora Gradient Card
Card with an animated aurora gradient that drifts across the background.
Author Bio Card
Author biography card with portrait, name, genre, and works.
Barcode Card
Barcode card with vertical black bars of varying widths and a numeric code below.
Barista Tips Card
Barista tips card with technique, grind size, and brew ratio.
Bestiary Entry Card
Bestiary entry card with a creature sketch, taxonomy, and danger rating.
Board Game Card
Board game card with a dice icon, turn indicator, and a player score panel.
Book Borrowed Record Card
Library checkout record card with book details and borrower info.
Border Trace Card
Two thin lines race around the perimeter and meet at the opposite corner.
Boulder Route Card
Bouldering route card with V-grade, attempts, and send type.
Cancellation Notice Card
Flight cancellation card with refund and rebook options.
Character Sheet Card
RPG character card with portrait, class, level, and an HP/MP bar pair.
Chess Piece Card
Chess piece card with a checkered board border, a knight glyph, and a coordinate.
Cocktail Mixology Card
Cocktail recipe card with ingredients, glass type, and garnish.
Coffee Brew Method Card
Coffee brewing guide with grind, temperature, time, and ratio.
Collectible Coin Card
Collectible coin card with a 3D embossed disc, denomination, and year.
Credential Badge
Credential badge with verified checkmark and access level bars.
Cruise Port Card
Cruise port card with arrival time, pier, and shore excursions.
Currency Exchange Card
Currency exchange card with rate and amount conversion.
Cyber Monday Card
Cyber Monday deal card with a circuit-board background, glowing price, and code.
Diary Page Entry Card
Personal diary card with lock decoration, date, and entry text.
Discount Voucher Card
Discount voucher card with a percentage burst, expiry, and a tear-off strip.
Duel Monster Card
Trap/spell card with a dark frame, attribute icon, and ATK/DEF stats in the footer.
Editor's Choice Card
Editor's choice card with a wax seal stamp and a serif review excerpt.
Employee Badge
Corporate employee badge with a clip slot, photo, department, and access tier.
Esports Bracket Card
Esports tournament bracket card with teams, score, and best-of.
Country Fair Ticket
Rustic country fair ticket with kraft paper, gingham accent, and prize ribbon.
Fashion Look Trend Card
Fashion trend look card with model silhouette and trending tags.