Guide StylingCV

Modèle de CV Prêt 2026

Mis à jour le 1 avril 2026

Modèle de CV Prêt 2026 | 75+ Modèles Professionnels Gratuits

@import url(‘https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;800&display=swap’);

:root {
–rt-teal: #268599;
–rt-coral: #e8885e;
–rt-navy: #16344c;
–rt-gradient: linear-gradient(135deg, #268599 0%, #618480 50%, #e8885e 100%);
–rt-font-body: ‘Inter’, sans-serif;
–rt-font-heading: ‘Inter’, sans-serif;
}

* { box-sizing: border-box; }

body {
background: #ffffff;
font-family: var(–rt-font-body);
margin: 0;
padding: 60px 20px;
}

.rt-container { max-width: 100rem; margin: 0 auto; }

/* Header Section */
.rt-hero-header {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
margin-bottom: 48px;
}
.rt-eyebrow-badge {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 6px 18px;
background: rgba(38, 133, 153, 0.08);
border: 1px solid rgba(38, 133, 153, 0.2);
border-radius: 100px;
font-size: 0.9rem;
font-weight: 700;
color: var(–rt-teal);
margin: 0 auto 24px auto;
}
.rt-hero-heading {
font-family: var(–rt-font-heading);
font-size: clamp(2.5rem, 5vw, 4.5rem);
font-weight: 800;
color: var(–rt-navy);
margin: 0 0 16px;
line-height: 1.2;
letter-spacing: -0.01em;
}
.rt-hero-heading span {
color: var(–rt-teal);
}
.rt-hero-sub {
font-size: 1.15rem;
color: #6b7280;
max-width: 750px;
margin: 0 auto;
line-height: 1.6;
font-weight: 500;
}

/* Filters */
.rt-filter-tabs {
display: flex;
flex-wrap: wrap;
gap: 8px;
justify-content: center;
margin-bottom: 40px;
}
.rt-filter-tab {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 10px 20px;
background: #fff;
color: #5a5a5a;
font-family: var(–rt-font-body);
font-size: 1rem;
font-weight: 700;
border: 1px solid #e2e8f0;
border-radius: 100px;
cursor: pointer;
transition: all 0.25s ease;
}
.rt-filter-tab:hover {
border-color: var(–rt-teal);
color: var(–rt-teal);
}
.rt-filter-tab–active {
background: var(–rt-gradient);
color: #fff;
border-color: transparent;
}
.rt-filter-tab–active:hover { color: #fff; }
.rt-filter-count {
font-size: 0.8rem;
font-weight: 700;
padding: 2px 8px;
border-radius: 100px;
background: rgba(0, 0, 0, 0.06);
}
.rt-filter-tab–active .rt-filter-count {
background: rgba(255, 255, 255, 0.25);
color: #fff;
}

.rt-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
}
@media (max-width: 1100px) { .rt-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .rt-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .rt-grid { grid-template-columns: 1fr; max-width: 340px; margin: 0 auto; } }

.rt-card {
background: #fff;
border-radius: 16px;
overflow: hidden;
text-decoration: none;
color: inherit;
border: 1px solid #e2e8f0;
transition: all 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275);
position: relative;
display: flex;
flex-direction: column;
}
.rt-card.hidden { display: none; }

.rt-card:hover {
transform: translateY(-8px);
box-shadow: 0 20px 50px rgba(38, 133, 153, 0.15);
border-color: var(–rt-teal);
}

.rt-card::before {
content: « »;
position: absolute;
top: 0; left: 0; right: 0;
height: 3px;
background: var(–rt-gradient);
transform: scaleX(0);
transform-origin: right;
transition: transform 0.35s ease;
z-index: 2;
}
.rt-card:hover::before { transform: scaleX(1); }

.rt-card-preview {
position: relative;
aspect-ratio: 3 / 4;
background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
padding: 16px;
border-bottom: 1px solid #e2e8f0;
}
.rt-card-image {
width: 100%;
height: 100%;
object-fit: contain;
object-position: top center;
transition: transform 0.5s ease;
display: block;
border-radius: 4px;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
background: #fff;
}
.rt-card:hover .rt-card-image { transform: scale(1.03); }

.rt-card-overlay {
position: absolute;
inset: 0;
background: rgba(22, 52, 76, 0.5);
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transition: opacity 0.3s ease;
backdrop-filter: blur(2px);
}
.rt-card:hover .rt-card-overlay { opacity: 1; }

.rt-card-use-btn {
padding: 12px 28px;
background: var(–rt-gradient);
color: #fff;
font-weight: 700;
font-size: 1rem;
border-radius: 10px;
box-shadow: 0 8px 24px rgba(38, 133, 153, 0.4);
transform: translateY(10px);
transition: transform 0.3s ease;
}
.rt-card:hover .rt-card-use-btn { transform: translateY(0); }

.rt-card-info {
padding: 16px 18px 18px;
display: flex;
flex-direction: column;
flex-grow: 1;
background: #fff;
}
.rt-card-header-row {
display: flex;
justify-content: space-between;
align-items: center;
margin: 0 0 6px;
}

/* Arabic Top CTA Banner */
.rt-top-cta {
background-color: #172435;
border-radius: 16px;
padding: 60px 20px;
text-align: center;
margin-bottom: 60px;
position: relative;
overflow: hidden;
font-family: var(–rt-font-body);
}
.rt-top-cta-badge {
display: inline-flex;
align-items: center;
gap: 8px;
background-color: rgba(38, 133, 153, 0.15);
color: #79a6b9;
padding: 8px 24px;
border-radius: 100px;
font-size: 0.9rem;
font-weight: 600;
margin-bottom: 30px;
}
.rt-top-cta-heading {
font-size: clamp(2rem, 4vw, 3rem);
font-weight: 800;
color: var(–rt-coral);
margin: 0 0 16px 0;
line-height: 1.3;
}
.rt-top-cta-heading span {
color: #3bb2c4;
display: block;
}
.rt-top-cta-divider {
width: 60px;
height: 3px;
background-color: var(–rt-teal);
margin: 0 auto 24px auto;
border-radius: 10px;
}
.rt-top-cta-sub {
color: #8b99ac;
font-size: 1.1rem;
max-width: 600px;
margin: 0 auto 40px auto;
line-height: 1.8;
}
.rt-top-cta-stats {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 30px;
margin-bottom: 30px;
}
.rt-top-cta-stat {
display: flex;
align-items: center;
gap: 10px;
color: #8b99ac;
font-size: 0.95rem;
}
.rt-top-cta-stat-icon {
width: 32px;
height: 32px;
background-color: rgba(38, 133, 153, 0.2);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: #3bb2c4;
}
.rt-top-cta-stat-value {
color: #3bb2c4;
font-weight: 700;
margin-left: 4px;
}
.rt-top-cta-tags {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 12px;
}
.rt-top-cta-tag {
background-color: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
color: #8b99ac;
padding: 6px 16px;
border-radius: 100px;
font-size: 0.85rem;
display: inline-flex;
align-items: center;
gap: 6px;
}
.rt-top-cta-tag-check {
color: #22c55e;
}
@media (max-width: 768px) {
.rt-top-cta { padding: 40px 20px; }
.rt-top-cta-stats { gap: 16px; flex-direction: column; align-items: center; }
}

.rt-card-name {
font-family: var(–rt-font-body);
font-size: 1.05rem;
font-weight: 800;
color: var(–rt-navy);
margin: 0;
}
.rt-card-rating {
display: flex;
align-items: center;
gap: 4px;
font-size: 0.9rem;
font-weight: 700;
color: #334155;
}
.rt-card-rating-star {
color: #fbbf24;
font-size: 1.1rem;
}
.rt-card-desc {
font-size: 0.85rem;
color: #64748b;
line-height: 1.6;
margin: 0 0 12px;
flex-grow: 1;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
.rt-card-tags {
display: flex;
gap: 6px;
flex-wrap: wrap;
}
.rt-tag {
padding: 4px 10px;
font-size: 0.75rem;
font-weight: 700;
border-radius: 100px;
background: rgba(38, 133, 153, 0.08);
color: var(–rt-teal);
letter-spacing: 0;
}
.rt-tag–ats {
background: rgba(232, 136, 94, 0.1);
color: var(–rt-coral);
}

منشئ الذكاء الاصطناعي أسرع 10 مرات من العمل اليدوي

Votre plateforme de lancement de carrière

أنشئ سيرة ذاتية تحصل بها على الوظيفة. في 10 دقائق مع منشئ السير الذاتية بالذكاء الاصطناعي.

%39 فرصة أكبر للحصول على الوظيفة

4.8/5 من 37,369 تقييم

%92 رضا العملاء

10 دقائق لإنشاء

✓ مدعوم بالذكاء الاصطناعي

✓ مجرب ميدانياً

✓ معتمد من الموارد البشرية

75+ Modèles Professionnels

نماذج سيرة ذاتية مجربة

Choisissez parmi 75+ modèles de CV professionnels, modernes et simples. Tous alimentés par IA et compatibles ATS.

Votre plateforme de lancement de carrière

نماذج سيرة ذاتية مجربة

Abdullah

Accent

Andero

Arabic Resume Modèles

Arabic Word Template

Architecte du CV

Aura

Axiom

Basic Template

Bilingual Resume Modèles

Blank Template

Bold

Classic Resume

Clean

Compact

Confidence

Creative

Creative

Editorial

Elegance

English Template

Essential

Ethereal

Exécutif

Exécutif Neat

Feminine

Feminine

Fillable Pdf Template

Fillable Pdf Template 2

Fillable Template

Framed

Gratuit Pdf Resume

Gratuit Resume

Gratuit Resume 2023

Full Arabic Template

Grid

Gulf Template

Highlight

Horizon

Influx

Leafish

Mark

Metro

Minimal

Minimalist

Minimalist Elite

Modernee

Modernee Corporate

Modernee Refined

Moderneeist

Newcast

Nexus

Noah

Noon

Onyx

Organized Resume Modèles

Pinnacle

Practical Resume Modèles

Print Ready Template

Prism

Professionnel Resume

Professionnel Resume Modèles

Pure

Rayhan

Rayhan

Ready Cv

Ready Cv Template

Ready Resume Modèles

Ready Resume Modèles 2

Resume Modèles

Resume Writing Guide

Sidebar

Simple

Simplified

Slate

Split

Standard

Static